WordPress中簡碼格式標(biāo)簽編寫的示例分析

這篇文章給大家分享的是有關(guān)WordPress中簡碼格式標(biāo)簽編寫的示例分析的內(nèi)容。小編覺得挺實(shí)用的，因此分享給大家做個(gè)參考，一起跟隨小編過來看看吧。

WordPress 簡碼是一種類似于論壇標(biāo)簽的東西，格式類似于把尖括號換成中括號的 Html 標(biāo)簽。簡碼很多人叫做短代碼，但官方的翻譯應(yīng)該是簡碼，在這里糾正一下。

簡碼格式

簡碼的格式非常靈活，可以是有屬性、無屬性、閉合、非閉合等等：

[example]

[example]內(nèi)容[/example]

[example attr="屬性" attr-hide="1"]內(nèi)容[/example]

[example "屬性"]

添加簡碼

添加簡碼需要使用 add_shortcode() 函數(shù)，兩個(gè)屬性，第一個(gè)為簡碼名，第二個(gè)是簡碼的回調(diào)函數(shù)。

add_shortcode( $tag, $func );

例如添加名為 test 的簡碼，回調(diào) Bing_shortcode_test() 函數(shù)：

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

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

從上邊的例子可以看到，簡碼的回調(diào)函數(shù)需要接收兩個(gè)參數(shù)。第一個(gè)是簡碼所有的屬性，通過數(shù)組儲存；第二個(gè)是簡碼的內(nèi)容（閉合簡碼中的內(nèi)容）。

移除簡碼

remove_shortcode() 函數(shù)可以移除一個(gè)簡碼，只需要指定簡碼的名稱即可移除。

remove_shortcode( 'test' );

remove_all_shortcodes() 函數(shù)用來移除當(dāng)前添加的所有簡碼。

remove_all_shortcodes();

判斷簡碼

關(guān)于判斷簡碼，有兩個(gè)函數(shù)，shortcode_exists() 函數(shù)判斷簡碼是否存在。

remove_all_shortcodes();
if( shortcode_exists( 'test' ) ) echo '簡碼 test 存在';//False
add_shortcode( 'test', 'Bing_shortcode_test' );
if( shortcode_exists( 'test' ) ) echo '簡碼 test 存在';//True

還有一個(gè) has_shortcode() 函數(shù)，判斷字符串中是否出現(xiàn)某某簡碼。

$content = '測試測試測試測試測試測試測試測試';
if( has_shortcode( $content, 'test' ) ) echo '字符串中有 test 簡碼';//False
$content = '測試測試測試測[test]測試[/test]試測試測試測試測試';
if( has_shortcode( $content, 'test' ) ) echo '字符串中有 test 簡碼';//True

執(zhí)行簡碼

do_shortcode() 函數(shù)用來在字符串中查找簡碼，并在簡碼處調(diào)用之前添加的回調(diào)函數(shù)，把簡碼執(zhí)行成需要的內(nèi)容。

WordPress 添加的鉤子：

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

例子：

function Bing_shortcode_test( $attr, $content ){
  return 'Hello World!';
}
add_shortcode( 'test', 'Bing_shortcode_test' );
$content = '測試測試測試測[test]試測試測試測試測試';
echo do_shortcode( $content );//測試測試測試測Hello World!試測試測試測試測試

簡碼屬性

簡碼支持各種格式的屬性，接受給簡碼回調(diào)函數(shù)的第一個(gè)參數(shù)。如果你要給參數(shù)設(shè)置默認(rèn)值，可以使用 shortcode_atts() 函數(shù)：

function Bing_shortcode_test( $attr, $content ){
  extract( shortcode_atts( array(
    'url' => 'http://www.bgbk.org',
    'hide' => false,
    'text' => '點(diǎn)擊隱藏 / 顯示'
  ), $attr ) );
  $hide = $hide ? ' ' : '';
  return '<a href="' . $url . '"' . $hide . '>' . $text . '</a>';
}
add_shortcode( 'test', 'Bing_shortcode_test' );

只有頁面中使用了簡碼的時(shí)候才加載腳本
而在開發(fā)的過程中，有時(shí)會遇到這種問題：簡碼模塊需要加載 JS 或者 CSS 腳本，而當(dāng)頁面沒有使用簡碼的時(shí)候就會造成資源浪費(fèi)。

比如下邊的這個(gè) Google 地圖插件：

//添加簡碼
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] 簡碼的時(shí)候才需要加載腳本，這怎么做到呢？

其實(shí)很簡單，只需要在簡碼函數(shù)觸發(fā)的時(shí)候在頁腳掛載腳本即可。

//添加簡碼
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' );

感謝各位的閱讀！關(guān)于“WordPress中簡碼格式標(biāo)簽編寫的示例分析”這篇文章就分享到這里了，希望以上內(nèi)容可以對大家有一定的幫助，讓大家可以學(xué)到更多知識，如果覺得文章不錯(cuò)，可以把它分享出去讓更多的人看到吧！