如何為WordPress外掛新增多層選單功能

如何為WordPress外掛程式新增多層選單功能

在 WordPress 中，外掛程式是擴充網站功能的重要組成部分。預設情況下，WordPress 提供了一些選單功能，例如頂部導覽功能表和側邊欄選單。但是，有時候我們需要在自己的插件中添加自訂的多層選單功能，以方便用戶存取插件的各種功能。

本文將教你如何為 WordPress 外掛程式添加多層選單功能，並提供一些程式碼範例。希望能對你的外掛開發工作有所幫助。

步驟一：建立外掛選單頁面

首先，我們需要建立一個用作外掛選單的頁面。在 WordPress 中，可以透過呼叫 add_menu_page() 函數來實現。

function my_plugin_menu_page() {
    add_menu_page(
        'My Plugin',     // 页面标题
        'My Plugin',     // 菜单标题
        'manage_options', // 用户权限
        'my-plugin',     // 菜单 slug
        'my_plugin_menu_callback', // 页面回调函数
        'dashicons-admin-plugins', // 菜单图标
        99 // 菜单位置
    );
}
add_action( 'admin_menu', 'my_plugin_menu_page' );

在上面的程式碼中，我們使用 add_menu_page() 函數建立了一個名為 "My Plugin" 的選單頁面。參數中的 my_plugin_menu_callback 是我們自訂的頁面回呼函數，用來渲染選單頁面的內容。

步驟二：新增子選單項目

如果我們想要新增多層選單功能，可以使用 add_submenu_page() 函數來實作。下面是一個範例程式碼：

function my_plugin_submenu_page() {
    add_submenu_page(
        'my-plugin', // 父菜单 slug
        'Submenu Page', // 子菜单标题
        'Submenu Page', // 页面标题
        'manage_options', // 用户权限
        'my-plugin-submenu', // 子菜单 slug
        'my_plugin_submenu_callback' // 页面回调函数
    );
}
add_action( 'admin_menu', 'my_plugin_submenu_page' );

在上面的範例程式碼中，我們使用 add_submenu_page() 函數建立了一個名為 "Submenu Page" 的子選單項目。參數中的 my_plugin_submenu_callback 是我們自訂的子選單頁面回呼函數。

步驟三：自訂選單頁面的內容

現在，我們需要為選單頁面新增自訂的內容。以下是一個範例程式碼：

function my_plugin_menu_callback() {
    echo '<h1 id="My-Plugin-Menu">My Plugin Menu</h1>';
    echo '<p>Welcome to My Plugin Menu. You can add your content here.</p>';
}

function my_plugin_submenu_callback() {
    echo '<h1 id="Submenu-Page">Submenu Page</h1>';
    echo '<p>Welcome to Submenu Page. You can add your content here.</p>';
}

在上面的範例程式碼中，我們在頁面回呼函數中加入了一些簡單的 HTML 內容。你可以根據自己的需求來自訂選單頁面的內容。

步驟四：新增更多子選單項目

如果我們需要新增多個子選單項，可以重複呼叫 add_submenu_page() 函數。以下是一個範例程式碼：

function my_plugin_submenu_page() {
    add_submenu_page(
        'my-plugin', // 父菜单 slug
        'Submenu Page 1', // 子菜单标题
        'Submenu Page 1', // 页面标题
        'manage_options', // 用户权限
        'my-plugin-submenu1', // 子菜单 slug
        'my_plugin_submenu_callback1' // 页面回调函数
    );

    add_submenu_page(
        'my-plugin', // 父菜单 slug
        'Submenu Page 2', // 子菜单标题
        'Submenu Page 2', // 页面标题
        'manage_options', // 用户权限
        'my-plugin-submenu2', // 子菜单 slug
        'my_plugin_submenu_callback2' // 页面回调函数
    );
}

// 页面回调函数
function my_plugin_submenu_callback1() {
    echo '<h1 id="Submenu-Page">Submenu Page 1</h1>';
    echo '<p>Welcome to Submenu Page 1. You can add your content here.</p>';
}

function my_plugin_submenu_callback2() {
    echo '<h1 id="Submenu-Page">Submenu Page 2</h1>';
    echo '<p>Welcome to Submenu Page 2. You can add your content here.</p>';
}

在上面的程式碼中，我們使用add_submenu_page() 函數分別建立了兩個子選單項目，並分別指定了不同的子選單slug 和頁面回調函數。

總結

透過上述步驟，我們可以為 WordPress 外掛程式新增多層選單功能。首先，透過add_menu_page() 函數建立外掛程式選單頁面；然後，透過add_submenu_page() 函數新增子選單項目；最後，透過自訂的頁面回呼函數為選單頁面新增內容。

希望這篇文章能幫助你在 WordPress 外掛開發中實現多層選單功能。記得在開發外掛時，遵循最佳實務和安全性原則。

以上是如何為WordPress外掛新增多層選單功能的詳細內容。更多資訊請關注PHP中文網其他相關文章！