Wordpress 网站 短代码插件设计

WordPress Shortcode 指的是一些使用[]包含的短代码，WordPress 会识别这些短代码并根据短代码的定义输出为特定的内容，Shortcode API 这个功能是 WordPress 从 2.5 版本开始引入的，使用它可以给网页和日志内容添加各种功能，并且 Shortcode 这个接口非常容易使用，功能非常强大。

简单的短代码可以简单内容替换，复杂的可以像Contact Form 7这样复杂的表单。

短代码可以在function.php文件里添加，也可以作为插件添加。

这里我们都用插件的方式添加。因为需要添加文件，目录，如果不是本地测试，可以使用wordpress 面板里的文件管理插件，或者FTP。

第一个短代码插件

在Wordpress 目录下，wp_content，然后plugins 目录下新建一个目录exampleplugin 如下：

C:\wamp64\www\wordpress\wp-content\plugins\exampleplugin

在这个目录下建一个文件 exampleplugin.php

文件内容如下：

This is a very simple short code
";
}
add_shortcode('firstshortcode', 'wp_first_shortcode');

我们的插件代码就完成了。

来到wordpress 的面板，我们可以看到我们的控件了，名字是 example short code plugins：

激活他，Activate。

现在我们可以测试验证我们的第一个短代码了。

新建一个网页，或打开一个原有的网页 添加 [firstshortcode] 如下：

我们保存，update， 然后我们view 看我们的网页，红框里的内容就是我们在短代码函数里输出的。

 带参数的短代码插件

现在把文件代码修改如下：

 'attribute 1 default',
		'bar' => 'attribute 2 default',
		// ...etc
	), $atts );

	$info= " this is a short code with parameter
foo=";
	$info.= $a['foo'];
	$info.="
 bar=";
	$info.= $a['bar'];
		return $info;
}
add_shortcode('secondshortcodewithparameter', 'shortcode_with_parameter_handler');

编辑网页如下： 

first short code

[firstshortcode]

second shortcode

[secondshortcodewithparameter]

after short code

网页更新，并显示如下：

因为我们在短代码行不输入参数，所以显示缺省参数。把第2个短代码输入1个参数，

[secondshortcodewithparameter foo="foo"]

则显示如下：

this is a short code with parameter
foo=foo
bar=attribute 2 default

输入2个参数，如下：

[secondshortcodewithparameter foo="foo para" bar="bar para"]

则显示为：

this is a short code with parameter
foo=foo para
bar=bar para

更多参数内容，可以参考：https://codex.wordpress.org/Shortcode_API 

带外部参数的短代码插件

短代码里可以使用外部参数，现在我们再加一个短代码函数，演示使用外部参数的例子，代码如下：

function wp_para_shortcode(){
	$info=" this is a short code with global varias
 file directory=";
	$info .=$_SERVER['DOCUMENT_ROOT'];
	$info .="
 page para= ";
	$info .=$_GET['q'];
return $info;
}
add_shortcode('wpparashortcode', 'wp_para_shortcode');

看看运行测试的情况：

在这个页面没有输入参数 q， 页面参数是空（page para=  )：

这个页面参数输入了 ?q=www.liwensoft.com ，所以页面显示的时候，参数就是 www.liwensoft.com，改变参数，页面内容也就改变了。我想做个下载的页面，q输入文件名，然后就可以得到文件的路径，最后下载改文件。

短代码插件就介绍到这里。测试的时候，很容易错一个字符，导致失败，特别是中文单引号，双引号。

为了你测试方便，把最后代码放这里:

 'attribute 1 default',
		'bar' => 'attribute 2 default',
		// ...etc
	), $atts );

	$info= " this is a short code with parameter
foo=";
	$info.= $a['foo'];
	$info.="
 bar=";
	$info.= $a['bar'];
		return $info;
}
add_shortcode('secondshortcodewithparameter', 'shortcode_with_parameter_handler');

function wp_para_shortcode(){
	$info=" this is a short code with global varias
 file directory=";
	$info .=$_SERVER['DOCUMENT_ROOT'];
	$info .="
 page para= ";
	$info .=$_GET['q'];
return $info;
}
add_shortcode('wpparashortcode', 'wp_para_shortcode');