[WordPress]版型開發:如何使用 WordPress 內建小工具區塊
WordPress 在後台有提供不少實用小工具,如:標籤雲、月曆、文字區塊…等等功能,使網站多了不少便利性,與減少了許多我們需要開發的項目,那要如何應用這些 WordPress 提供的小工具呢?其實很簡單,讓我們繼續往下看:
註冊 小工具區塊(widgets):
首先必須要先在 function.php
中,註冊一塊 小工具 的區塊 :
(這邊以 sidebar-first
為例)
/**
* Register our sidebars and widgetized areas.
*
*/
function register_widgets_init() {
register_sidebar( array(
'name' => 'sidebar-first',
'id' => 'sidebar-first',
'before_widget' => '<div class ="widget-item">',
'after_widget' => '</div>',
'before_title' => '<h2 class="widget-title">',
'after_title' => '</h2>',
) );
}
add_action( 'widgets_init', 'register_widgets_init' );
藉由 register_sidebar()
的 function ,在 widgets_init
的 action,註冊一塊小工具的區塊,可以使用 register_sidebar()
的參數來自定區塊的架構與 class 名稱
函式說明:register_sidebar()
hook : do_action( ‘widgets_init’ )
前端顯示 小工具區塊(widgets):
接下來的步驟就更簡單了,既然我們 小工具區塊(widgets)在上一步驟都已經註冊完成了,我們只要在前端中,區把塊發放出來就可以了:
在想呈現的 template.php
使用 dynamic_sidebar()
函數做呈現就可以了,如下:
<aside id ="sidebar-first" class="primary-sidebar widget-area" srole="complementary">
<!-- Secondary content -->
<?php dynamic_sidebar( 'sidebar-first' ); ?> // 使用 `dynamic_sidebar()` 函數呈現
</aside>
函式說明:dynamic_sidebar()
之後直接在後台 外觀/小工具
裡就可以拉放一些小工具來看看效果嘍: