WordPress 從 2.5 版本開始增加了一個類似 BBCode 標簽的 Shortcode API，可以使用它在日志的內容中來給日志內容添加各種功能。Shortcode 這個接口非常容易使用，並且功能非常強大。
簡單說 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