搜索
SR網頁設計工作室 - 購物網站/企業官網專業開發 Wordpress 使用教程 如何在wordpress中添加自定義的短代碼(shortcode) ...
byadmin 發表於 2013-11-5 18:08:33 , 6467人已閱讀 , 0人回應
【開場題外話】以短代碼的製作來講,Shawn不得不說DISCUZ系統上製作各種客製化的短代碼真的是太方便了,只可惜製作太多的話,文章介面上面的按鈕會塞不下。相較於Discuz方便的短代碼製作介面,Wordpress就必須要自行添加各種Function程式碼到functions.php檔案中。但Wordpress的短代碼比Discuz能夠運用的範圍廣非常多,他可以直接應用在各頁面甚至是模板製作當中,應用層面非常廣泛。下面來詳細解釋一下:

shortcodes.jpg

什麼是wordpress的短代碼(shortcode)?

顧名思義,短代碼就是用來簡化後的程式碼,短代碼是定義好的一段文字,當網站用瀏覽器瀏覽的時候,它就會顯示成它所引用的內容。簡單來說,就是相當於把代碼包起來放進一個包裹,然後把包裹起一個名字,到時候需要調用的時候只需要說出包裹的名字就可以了,這個名字就是短代碼。

舉個例子,假如我們把顯示作品圖片的這段代碼定義為短代碼[mygallery],這樣當你在發表文章或編輯網站時,只需要輸入[mygallery]這個短代碼即可,而在瀏覽器實際瀏覽中,它則會引用源代碼來替代[mygallery],從而顯示出作品圖片。
在wordpress裡建設網站、發佈文章,甚至製作wordpress模板的時候,都可以根據自己需要定義一些短代碼,方便隨時調用。

如何添加wordpress簡碼?

假設我們要在文章中添加一段Google廣告代碼,通常的做法是進入html編輯模式,然後將Adsense代碼複製粘貼進去,如果內容多了可能就會稍顯麻煩了。下面我們要示範如何為這些代碼設定一個短代碼[adsense]。

在wordpress裡添加短代碼其實是非常簡單的任務,首先我們要定義一個函數,用來輸出Adsense的原代碼,打開你的主題文件夾的functions.php文件,把下面所示的代碼粘貼進去。
  1. function get_adsense($atts) {return '<script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
  2. <!-- SR中型廣告(300*250) -->
  3. <ins class="adsbygoogle"
  4.      style="display:inline-block;width:300px;height:250px"
  5.      data-ad-client="ca-pub-6487833352554941"
  6.      data-ad-slot="5706308917"></ins>
  7. <script>
  8. (adsbygoogle = window.adsbygoogle || []).push({});
  9. </script>'}
複製代碼
這段函數的作用非常明顯,它是將Google Adsense的代碼轉換成一段字符。現在已經有一個將代碼返回成我們所需要的字符的函數,下面就要把它和我們要設定的短代碼結合起來,這裡使用wordpress的一個函數add_shortcode,具體代碼如下:
  1. add_shortcode('adsense', 'get_adsense');
複製代碼
第一個參數adsense表示短代碼的名稱,第二個參數get_adsense表示代碼所調用的函數。這樣當遇到一個短代碼時,就會用後面函數返回呼叫設置的Function。

其他詳細的資料可以參閱完整的API

如何使用wordpress簡碼?

只要發佈文章或頁面時,將短代碼(例:[adsense])輸入進去就可以了。

收藏回覆 只看該作者 道具 舉報

Traffic Exchange Site
您需要登錄後才可以回帖 登錄 | 立即註冊

作者資訊

文章分類

SR數位設計工作室

  • 服務專線:03-3555-069


ECSHOP購物網站開發|接案說明|線上洽詢|隱私權政策|SR數位設計(CMS)

信箱:sr.design2011@gmail.com

, Processed in 0.096001 second(s), 43 queries , Gzip On.

Copyright © 2011-2014 Template By SR網頁設計清新部落風格

Core - DZ2.5 GMT+8, 2024-12-22 18:25

回頂部