WordPress 简码是一种类似于论坛标签的东西,格式类似于把尖括号换成中括号的 Html 标签。简码很多人叫做短代码,但官方的翻译应该是简码,在这里纠正一下。

简码的开发的逻辑比较简单,主要就是添加、删除和判断,会在本文全部介绍。

简码格式

简码的格式非常灵活,可以是有属性、无属性、闭合、非闭合等等:

[example]

[example]内容[/example]

[example attr="属性" attr-hide="1"]内容[/example]

[example "属性"]

添加简码

添加简码需要使用 add_shortcode() 函数,两个属性,第一个为简码名,第二个是简码的回调函数。

1
add_shortcode( $tag, $func );

例如添加名为 test 的简码,回调 Bing_shortcode_test() 函数:

1
2
3
4
function Bing_shortcode_test( $attr, $content ){
  return 'Hello World!';
}
add_shortcode( 'test', 'Bing_shortcode_test' );

在文章中添加 [test] 就会输出 “Hello World!”。

从上边的例子可以看到,简码的回调函数需要接收两个参数。第一个是简码所有的属性,通过数组储存;第二个是简码的内容(闭合简码中的内容)。

移除简码

remove_shortcode() 函数可以移除一个简码,只需要指定简码的名称即可移除。

1
remove_shortcode( 'test' );

remove_all_shortcodes() 函数用来移除当前添加的所有简码。

1
remove_all_shortcodes();

判断简码

关于判断简码,有两个函数,shortcode_exists() 函数判断简码是否存在。

1
2
3
4
remove_all_shortcodes();
if( shortcode_exists( 'test' ) ) echo '简码 test 存在';//False
add_shortcode( 'test', 'Bing_shortcode_test' );
if( shortcode_exists( 'test' ) ) echo '简码 test 存在';//True

还有一个 has_shortcode() 函数,判断字符串中是否出现某某简码。

1
2
3
4
$content = '测试测试测试测试测试测试测试测试';
if( has_shortcode( $content, 'test' ) ) echo '字符串中有 test 简码';//False
$content = '测试测试测试测[test]测试[/test]试测试测试测试测试';
if( has_shortcode( $content, 'test' ) ) echo '字符串中有 test 简码';//True

执行简码

do_shortcode() 函数用来在字符串中查找简码,并在简码处调用之前添加的回调函数,把简码执行成需要的内容。

WordPress 添加的钩子:

1
add_filter( 'the_content', 'do_shortcode', 11 );

例子:

1
2
3
4
5
6
function Bing_shortcode_test( $attr, $content ){
  return 'Hello World!';
}
add_shortcode( 'test', 'Bing_shortcode_test' );
$content = '测试测试测试测[test]试测试测试测试测试';
echo do_shortcode( $content );//测试测试测试测Hello World!试测试测试测试测试

简码属性

简码支持各种格式的属性,接受给简码回调函数的第一个参数。如果你要给参数设置默认值,可以使用 shortcode_atts() 函数:

1
2
3
4
5
6
7
8
9
10
function Bing_shortcode_test( $attr, $content ){
  extract( shortcode_atts( array(
    'url' => 'http://www.bgbk.org',
    'hide' => false,
    'text' => '点击隐藏 / 显示'
  ), $attr ) );
  $hide = $hide ? ' style="display:none;"' : '';
  return '<a href="' . $url . '"' . $hide . '>' . $text . '</a>';
}
add_shortcode( 'test', 'Bing_shortcode_test' );

只有页面中使用了简码的时候才加载脚本
而在开发的过程中,有时会遇到这种问题:简码模块需要加载 JS 或者 CSS 脚本,而当页面没有使用简码的时候就会造成资源浪费。

比如下边的这个 Google 地图插件:

1
2
3
4
5
6
7
8
9
10
11
//添加简码
function Bing_add_google_map( $atts, $content ){
  //content...
}
add_shortcode( 'google_map', 'Bing_add_google_map');
  
//挂载脚本
function Bing_add_javascript(){
  wp_enqueue_script( 'map_scripts' );
}
add_action( 'wp_enqueue_scripts', 'Bing_add_javascript' );

只有在页面中使用了 [google_map] 简码的时候才需要加载脚本,这怎么做到呢?

其实很简单,只需要在简码函数触发的时候在页脚挂载脚本即可。

1
2
3
4
5
6
7
8
9
10
11
12
13
//添加简码
function Bing_add_google_map( $atts, $content ){
  $GLOBALS['google_map_shortcode'] = true;
  return '地图的代码';
}
add_shortcode( 'google_map', 'Bing_add_google_map');
  
//挂载脚本
function Bing_add_javascript(){
  global $google_map_shortcode;
  if( isset( $google_map_shortcode ) && $google_map_shortcode ) wp_enqueue_script( 'map_scripts' );
}
add_action( 'wp_footer', 'Bing_add_javascript' );

总结

简码是个非常强大的功能,对文章内容是一种很好的扩展,利用好可以让添加某些东西变的方便快捷。

关于简码的函数都在:wp-includes/shortcode.php 文件里,有能力的朋友可以阅读一下,了解原理。

详解WordPress中简码格式标签编写的基本方法的更多相关文章

  1. 详解HTML中的表格标签

    详细代码如下: <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" ...

  2. Usermod 命令详解 ------工作中修改shell时用 usermod -s /bin/csh home

     Usermod 命令详解 2012-09-11 11:01:36 标签:usermod 原创作品,允许转载,转载时请务必以超链接形式标明文章 原始出处 .作者信息和本声明.否则将追究法律责任.htt ...

  3. 使用IDEA详解Spring中依赖注入的类型(上)

    使用IDEA详解Spring中依赖注入的类型(上) 在Spring中实现IoC容器的方法是依赖注入,依赖注入的作用是在使用Spring框架创建对象时动态地将其所依赖的对象(例如属性值)注入Bean组件 ...

  4. Java基础进阶:多态与接口重点摘要,类和接口,接口特点,接口详解,多态详解,多态中的成员访问特点,多态的好处和弊端,多态的转型,多态存在的问题,附重难点,代码实现源码,课堂笔记,课后扩展及答案

    多态与接口重点摘要 接口特点: 接口用interface修饰 interface 接口名{} 类实现接口用implements表示 class 类名 implements接口名{} 接口不能实例化,可 ...

  5. jQuery:详解jQuery中的事件(二)

    上一篇讲到jQuery中的事件,深入学习了加载DOM和事件绑定的相关知识,这篇主要深入讨论jQuery事件中的合成事件.事件冒泡和事件移除等内容. 接上篇jQuery:详解jQuery中的事件(一) ...

  6. 图文详解Unity3D中Material的Tiling和Offset是怎么回事

    图文详解Unity3D中Material的Tiling和Offset是怎么回事 Tiling和Offset概述 Tiling表示UV坐标的缩放倍数,Offset表示UV坐标的起始位置. 这样说当然是隔 ...

  7. 深入详解SQL中的Null

    深入详解SQL中的Null NULL 在计算机和编程世界中表示的是未知,不确定.虽然中文翻译为 “空”, 但此空(null)非彼空(empty). Null表示的是一种未知状态,未来状态,比如小明兜里 ...

  8. java 乱码详解_jsp中pageEncoding、charset=UTF -8"、request.setCharacterEncoding("UTF-8")

    http://blog.csdn.net/qinysong/article/details/1179480 java 乱码详解__jsp中pageEncoding.charset=UTF -8&quo ...

  9. 详解Java中的clone方法

    详解Java中的clone方法 参考:http://blog.csdn.net/zhangjg_blog/article/details/18369201/ 所谓的复制对象,首先要分配一个和源对象同样 ...

随机推荐

  1. shell中的数值运算

    By francis_hao    Oct 2,2017   本文摘录自bash的man手册.   算数运算相关的形式 形式 含义 ((expression)) expression按照下面描述的算术 ...

  2. jenkins实现maven项目自动化部署tomcat

    最近公司有用到jenkins实现自动化部署,这里我对新的东西也是比较感兴趣,就用了点时间尝试了一下,虽然网上有很多这种例子,但是可能有些细节我也走了一些弯路.在这里记录一下,方便下次用到. 实现环境: ...

  3. HDU1078记忆化搜索

    FatMouse and Cheese Time Limit: 2000/1000 MS (Java/Others)    Memory Limit: 65536/32768 K (Java/Othe ...

  4. Ubuntu修改系统语言为英文可支持中文

    简单来说,就行修改/etc/default/locale文件,设置语言位UTF-8,如果没有这个语言,就执行命令locale-gen en_US.UTF-8进行安装,没有即时生效的话就重启. 查看当前 ...

  5. bug级别分类

    bug级别分类 2014-10-20 10:02 6403人阅读 评论(0) 收藏 举报  分类: SQA(17)  版权声明:本文为博主原创文章,未经博主允许不得转载.   目录(?)[+]   由 ...

  6. UVA 10837 A Research Problem

    https://vjudge.net/problem/UVA-10837 求最小的n,使phi(n)=m #include<cstdio> #include<algorithm> ...

  7. uva 12325 Zombie's Treasure Chest

    https://vjudge.net/problem/UVA-12325 题意: 一个箱子,体积为N 两种宝物,体积为S1.S2,价值为V1.V2,数量无限 最多装多少价值的宝物 数据范围:2^32 ...

  8. 51nod 1284 2 3 5 7的倍数 | 容斥原理

    用容斥原理求出不满足条件的个数cnt,然后用n-cnt就得到答案了. 这里不满条件的数就是能整除2,3,5,7这些数的集合并集.要计算几个集合并集的大小,我们要先将所有单个集合的大小计算出来,然后减去 ...

  9. 常见XSD问题

    < xs:elementname="status"> < xs:complexType> < xs:sequence> < xs:elem ...

  10. 【poj2947】高斯消元求解同模方程组【没有AC,存代码】

    题意: p start enda1,a2......ap (1<=ai<=n)第一行表示从星期start 到星期end 一共生产了p 件装饰物(工作的天数为end-start+1+7*x, ...