• WordPress Shortcode(简码)介绍及使用详解


    WordPress 从 2.5 版本开始增加了一个类似 BBCode 标签的 Shortcode API,可以使用它在日志的内容中来给日志内容添加各种功能。Shortcode 这个接口非常容易使用,并且功能非常强大。

    wpdaxue.com-201301300

    简单说 WordPress Shortcode 指的是一些使用[]包含的短代码,WordPress会识别这些短代码并根据短代码的定义输出为特定的内容。

    Shortcode 类型

    Shortcode API 支持几乎所有可能的组合形式:自关闭标签,开放标签,含有参数的标签等。

    1
    2
    3
    4
    5
    6
    
    [mycode]
    [mycode foo="bar" id="123" color="red" something="data"]
    [mycode]Some Content[/mycode]
    [mycode]<p><a href="http://example.com/">HTML Content</a<>/p>[/mycode]
    [mycode]Content [another-shotcode] more content[/mycode]
    [mycode foo="bar" id="123"]Some Content[/mycode]

    Shortcode 基本概念

    首先你要去定义一个函数,来处理你定义的 Shortcode,和它的属性参数以及引用的内容。

    1
    2
    3
    4
    5
    6
    
    function my_shortcode_func($attr, $content) {
        // $attr $key=>$value 的数组
        // $content 是 shortcode 中包含的字符串
        // 对 $attr 和 $content 进行处理
        // 返回预期的值
    }

    然后把自己定义的 Shortcode 和其处理函数管理起来,以便 [mycode attr="value"]content[/mycode] 能够按照预期执行。

    1
    
    add_shortcode('mycode', 'my_shortcode_func')

    Shortcode 相关的所有函数

    WordPress 定义了以下和 Shortcode 相关的函数:

    1
    2
    3
    4
    
    add_shortcode('mycode', 'function_name'); // 定义一个新的 Shortcode
    remove_shortcode('mycode'); // 移除一个 Shortcode
    remove_all_shortcodes(); // 移除所有的 Shortcode
    $return = do_shortcode($content); // 应用 Shortcode 到内容而不输出

    一个简单的 Shortcode 例子

    以我爱水煮鱼写的 Antispambot ShortCode 插件为例,内容就是邮箱地址,有个参数 $link 为 1 时候,把邮箱显示可点击,参数如下:

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    
    function antispambot_shortcode_handler($atts, $content='') {
    	extract( shortcode_atts( array(
    		'link' => '0'
    	), $atts ) );
     
    	if($link){
    		return '<a href="mailto:'.antispambot($content,1).'" title="mail to '.antispambot($content,0).'">'.antispambot($content,0).'</a>';
    	}else{
    		return antispambot( $content,0);
    	}
    }
    add_shortcode('email', 'antispambot_shortcode_handler');

    使用 Shortcode 投放 Google Adsense 广告

    把下面的代码保存到你当前的主题的 functions.php,或者上传到插件目录下并激活。

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    
    <?php
    /*
    Plugin Name: Shorcode for Google Adsense
    Plugin URI:  http://blog.wpjam.com/m/shortcode-google-adsense/
    Description: 使用 Shortcode 投放 Google Adsense 广告
    Version: 0.1
    Author: Denis
    */
    add_shortcode('adsense', 'adsense_shortcode');
    function adsense_shortcode($atts) {
    	extract(shortcode_atts(array(
    	'type' => '468x60',
    	), $atts));
    	switch ($type) {
    		case '468x60' :
    		return 
    			//468x60 的广告代码
    		case '300x250' :
    		return 
    			//300x250 的广告代码
    	}
    }

    然后你就可以通过撰写文章的时候,在相应的位置输入 [adsense] 你的 468×60 的广告代码(默认的广告代码),如果你想插入 300×250 的广告代码,在文章内容中插入 [adsense type="300x250"],当然你也可以扩展上面的代码增加更多广告的格式和类型。

    这样就可以想把广告插在文章中的哪个位置,就能插在哪个位置了,  非常方便。

    在侧边栏 Widgets 中使用 Shortcode

    Shortcode 很方便,但是只能用在日志内容中,那么如何在 WordPress 的侧边栏的 Widgets 中使用 Shortcode,在当前主题的 functions.php 中添加如下代码:

    1
    
    add_filter('widget_text', 'do_shortcode');

    然后你在 WordPress 后台 > 外观 > Widgets 界面添加一个文本 Widget,然后插入博客中经启用 shortcode 即可。

    在主题的文件中使用 Shortcode

    如果你想用在主题文件中使用名为 [my_shortcode] 的 Shortcode,你只需要按照下面的方式使用do_shortcode() 函数即可:

    1
    
    <?php echo do_shortcode("[my_shortcode]"); ?>

    解决 Shortcode 中自动添加的 br 或者 p 标签

    我们在使用 WordPress Shortcode API 开发插件的时候,有个比较麻烦的问题,就是 WordPress 会自动在 shortcode 内添加 br 或者 p 标签,这样可能会打乱你的原先预想的 HTML 结构和布局。

    造成这个问题的原因是 WordPress 默认的日志内容处理流程中,wpautop(将回车转换成 p 或者 br 标签的函数)是在 Shortcode 前面运行的。所以我们的解决方案也是非常简单,改变它们执行的顺序,在当前主题的 functions.php 文件中添加:

    1
    2
    
    remove_filter( 'the_content', 'wpautop' );
    add_filter( 'the_content', 'wpautop' , 12);

    这样调整顺序之后,你的 shortcode 里面的内容,就不会有自动添加的 p 或者 br 标签,但是如果 shortcode 中部分的内容你又需要一些 p 或者 br 标签用来换行的话,你需要自己手动在自己 shortcode 处理程序中添加 wpautop 来处理了。

    1
    2
    3
    4
    5
    
    function bio_shortcode($atts, $content = null) {
       $content = wpautop(trim($content));
       return '<div class="bio">' . $content . '</div>';
    }
    add_shortcode('bio', 'bio_shortcode');

    转:

    https://www.wpdaxue.com/wordpress-shortcode.html

  • 相关阅读:
    yii之behaviors
    查看windows系统信息
    idm chrome扩展被阻止解决办法
    音乐乐理基础
    bootstrap4
    七牛上传整合CI
    提升上传速度
    卡漫绘图
    指针的操作
    定语从句八个易混淆
  • 原文地址:https://www.cnblogs.com/kenshinobiy/p/7327837.html
Copyright © 2020-2023  润新知