利用WordPress设置API实现自定义设置页面。

2024-01-20 0 813

正文：

wordpress后台自定义设置页面的实现方式有很多种，有各种框架。Wordpress 官方还提供了一套设置页面的api，你会得到一个完全适合 wordpress 背景的页面。当然，不用也可以。比如狗哥喜欢直接写html，因为不用记函数。

以下是使用 WordPress 设置 API 的自定义设置页面演示。复制以下代码并将其保存为 my-custom-plugin.php 文件，并在插件目录中创建一个我的自定义插件文件夹，您可以在后台插件列表中看到它。


<?php
/**
 * Plugin Name: My Custom Plugin
 * Description: A simple custom plugin with a settings page.
 * Version: 1.0
 * Author: Your Name
 */

// Add menu item for the settings page
add_action('admin_menu', 'my_custom_plugin_menu');

function my_custom_plugin_menu() {
    add_options_page('My Custom Plugin Settings', 'My Custom Plugin', 'manage_options', 'my-custom-plugin-settings', 'my_custom_plugin_settings_page');
}

// Display the settings page
function my_custom_plugin_settings_page() {
    ?>
    <div class="wrap">
        <h1>My Custom Plugin Settings</h1>
        <form method="post" action="options.php">
            <?php
            settings_fields('my-custom-plugin-settings-group');
            do_settings_sections('my-custom-plugin-settings');
            submit_button();
            ?>
        </form>
    </div>
    <?php
}

// Register settings, sections, and fields
add_action('admin_init', 'my_custom_plugin_settings_init');

function my_custom_plugin_settings_init() {
    register_setting('my-custom-plugin-settings-group', 'my_custom_plugin_text');
    register_setting('my-custom-plugin-settings-group', 'my_custom_plugin_checkbox');
    register_setting('my-custom-plugin-settings-group', 'my_custom_plugin_select');

    add_settings_section('my-custom-plugin-settings-section', 'Settings', null, 'my-custom-plugin-settings');

    add_settings_field('my_custom_plugin_text', 'Text Input', 'my_custom_plugin_text_callback', 'my-custom-plugin-settings', 'my-custom-plugin-settings-section');
    add_settings_field('my_custom_plugin_checkbox', 'Checkbox', 'my_custom_plugin_checkbox_callback', 'my-custom-plugin-settings', 'my-custom-plugin-settings-section');
    add_settings_field('my_custom_plugin_select', 'Select Dropdown', 'my_custom_plugin_select_callback', 'my-custom-plugin-settings', 'my-custom-plugin-settings-section');
}

// Callback functions for input fields with descriptions and labels
function my_custom_plugin_text_callback() {
    $text = get_option('my_custom_plugin_text');
    echo '<input type="text" name="my_custom_plugin_text" value="' . esc_attr($text) . '">';
    echo '<p class="description">Enter some text here.</p>';
}

function my_custom_plugin_checkbox_callback() {
    $checkbox = get_option('my_custom_plugin_checkbox');
    echo '<label><input type="checkbox" name="my_custom_plugin_checkbox" value="1"' . checked(1, $checkbox, false) . '> Enable this option.</label>';
}

function my_custom_plugin_select_callback() {
    $select = get_option('my_custom_plugin_select');
    ?>
    <select name="my_custom_plugin_select">
        <option value="option1" <?php selected($select, 'option1'); ?>>Option 1</option>
        <option value="option2" <?php selected($select, 'option2'); ?>>Option 2</option>
        <option value="option3" <?php selected($select, 'option3'); ?>>Option 3</option>
    </select>
    <p class="description">Choose an option from the dropdown.</p>
    <?php
}

转载请注明：汇站网 » 利用 WordPress 设置 API 实现自定义设置页面。

赏

微信扫一扫