[WordPress] 新增後台頁面

WordPress 不只可以當 Blog,也可以架設成其他類型的網站 (例如報名網站)

有時候想要替自己的網站加一些特殊的功能,而找不到外掛可以來頂替時,就要自己動手做了

而直接做在後台裡是一個不錯的選擇,以下為在後台開新頁面並將頁面放在左側管理選單

先在 wp-content/themes/sample_theme/functions/theme_options.php 裡面加入一些內容:

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
// 註冊頁面
// 功能表名稱與頁面 title 設成 "自訂頁面",權限等級設為 2 (即身分為作者以上的使用者都能看到這個頁面),page 為 my_custom_page,callback 為 load_custom_page
function add_menu_custom_page() {
    add_menu_page('自訂頁面', '自訂頁面', 2, 'my_custom_page', 'load_custom_page');
}

// 設定要載入的 script or css
function custom_page_init() {
    if ( isset($_GET['page']) && $_GET['page'] == 'my_custom_page' ) {
        wp_enqueue_style("jquery-ui_layout_1.10.3", "http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css");
        wp_enqueue_style("style", THEME_CSS."/custom_page.css", false, "1.0", "all");
        wp_enqueue_script("jquery_1.9.1", "http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js");
        wp_enqueue_script("jquery-ui_core_1.10.3", "http://code.jquery.com/ui/1.10.3/jquery-ui.js");
    }
}

// 讀取頁面模版 (在此將模版檔案寫在另一個檔案裡)
function load_custom_page() {
    include ('../custom_page.php');
}

// 將前面的 function 載入 wordpress 的核心執行項目中
add_action('admin_init', 'custom_page_init');
add_action('admin_menu', 'add_menu_custom_page');

頁面內容寫在 wp-content/themes/sample_theme/custom_page.php

1
2
3
4
echo "This is custom page.";
/*
do something
*/

關於前面所用到的WordPress function完整說明可參考官方文件:

而頁面權限等級的部分,可以參考 WordPress Codex :: User Levels

另外一個是加入子選單的部分,用法也是大同小異:WordPress Codex :: add_submenu_page

值得注意的是若要加入自訂頁面至預設功能選單要用到子函式,例如要在 options-general 加入子選單要使用 add_options_page() 來新增。

Licensed under CC BY-NC-SA 3.0 TW
comments powered by Disqus