WordPress 短代码制作教程

今天的特色图像略坑(上面直角下面圆角),WordPress的短代码是什么?例如,标准的插入一张图片的代码应该是用很长的 img 标签;在页面中一些固定的文字需要加入特殊的样式,我们也不需要使用 div+CSS 了,只需要加入一段短代码。简单的说,短代码就是用非常简单的代码区替代冗长的代码的一种方法,是WordPress内置的高级功能,今天我们就来讲一讲怎样使用短代码吧。

 短代码的形式

[hehe a="a" b="c"] …… [/hehe]

短代码和普通 HTML 的编写形式不是很相同,采用的是方括号的形式编写的,短代码中还可以包含很多的属性,也就相当于,如果一个短代码中有不同的属性还可以达到不同的效果呢?

怎样使用短代码

WordPress的短代码需要你手动在主题目录 functions.php 文件中编写创建函数才可以正常使用,下面我们就讲一讲怎样创建短代码函数。

function 函数名($atts,$content=null)
{
    extract(shortcode_atts(array("参数一名称" => '0',"参数二名称" => '1'), $atts));
    return 返回值;
}
add_shortcode(短代码名,函数名);

在主题的 function.php 文件中插入以上形式的代码就可以使用短代码了,那么函数要怎么编写呢,其实很简单了。

例如:

function hello($atts,$content=null)
{
    return "这是我的第一个短代码";
}
add_shortcode("Test",'hello');

上面是最简单的一种短代码,输出固定的文字,我们发一篇文章在文章中输入以下内容:

[Test]任意内容[/Test]

之后就可以在文章发布之后看到文章中显示了。

WordPress 短代码制作教程

显示了我们在代码中返回的内容,也许你注意到了,短代码的特性是:在短代码标签中写任意内容,都会被返回的值替代掉。那么有功能真正实用的短代码怎么写呢?在主题目录的functions.php中添加:

ction Theimg($atts,$content=null)
{
    extract(shortcode_atts(array('img'=>'0'), $atts));
    return '<a href="'.$img.'"><img src="'.$img.'"/></a>';
}
add_shortcode('ThisIsimg',Theimg);

在文章中输入以下内容:

[ThisIsimg img="http://www.baidu.com/img/10.23_112a036972a74bbcb84b8957316c8aa3.gif"][/ThisIsimg]

可以看到,我们定义了一个叫做 img 的属性并且给了一个图片地址,之后我们在代码中利用:

 extract(shortcode_atts(array('img'=>'0'), $atts));

定义了个 img 变量之后,返回(return) 了一个包含 img 变量并且被附加了一些字符串的值,并且显示了图片,效果如下:

WordPress 短代码制作教程

图片正常显示了。请注意,获取参数的标准方式就是上面那样的。怎样获得短代码标签之内的内容呢?

function Test($atts,$content=null)
{
    return "aa".$content."bb";
}
add_shortcode(Test2,Test);

使用 content 变量直接获取短代码中间的字符串就好了。

短代码的核心部分就是那么简单,剩下的就需要你使用 PHP 代码的各种运算去实现更多使用功能了。

对于短代码,就WordPress而言,我是觉得非常方便的,首先是省略了非常多的代码的写入,减少了数据库的占用,另外丰富了文章。但是个人是不会选择使用短代码的,考虑到通用性的缘故,如果要更换站点系统或是主题,短代码就失效了,并且还会显示在文章中。

展开评论