鑰匙要點(diǎn)

WordPress設(shè)置API是創(chuàng)建主題設(shè)置頁面的流行工具，可以自定義功能，行為和樣式，而無需直接編輯PHP或CSS文件。這使更新主題更加容易，并防止用戶所做的更改丟失。
• >
設(shè)置API允許自定義選項(xiàng)，例如社交配置文件，靜態(tài)或響應(yīng)布局之間的選擇以及徽標(biāo)上傳。這些功能可以使用add_settings_section，add_settings_field和register_setting等函數(shù)添加。
• >使用設(shè)置API創(chuàng)建的設(shè)置可以使用get_option（）函數(shù)在前端檢索，因?yàn)樵O(shè)置API使用選項(xiàng)API在內(nèi)部存儲(chǔ)值。這使得易于訪問和利用主題中的自定義設(shè)置。
>
>大多數(shù)WordPress主題都有一個(gè)主題設(shè)置頁面來自定義其功能，行為和樣式。使用主題提供主題設(shè)置頁面，使您的用戶可以輕松自定義主題，而不是直接編輯PHP或CSS文件。這使更新主題更加容易，因?yàn)橛脩舨粫?huì)丟失他們所做的更改。 在本教程中，我們將學(xué)習(xí)創(chuàng)建主題設(shè)置頁面的“ WordPress”推薦方法，即使用WordPress設(shè)置API。 WordPress設(shè)置API是在WordPress 2.7中添加的，此后已成為最受歡迎的WordPress API之一。如果您打算在WordPress插件中添加設(shè)置頁面，則本教程也將很有用。讓我們開始。

我們將在主題設(shè)置頁面中包括什么？

> 主題設(shè)置頁面中的

選項(xiàng)取決于主題支持的功能和自定義。也就是說，每個(gè)主題設(shè)置頁面中都有一些常見的內(nèi)容。一些常見的選擇是：社交網(wǎng)址，靜態(tài)或響應(yīng)式布局和標(biāo)頭徽標(biāo)，僅舉幾例。在本教程中，我將向您展示如何在我們的主題設(shè)置頁面中包含這四個(gè)選項(xiàng)。

>

創(chuàng)建一個(gè)主題設(shè)置頁菜單項(xiàng)

首先，我們必須在管理面板上創(chuàng)建一個(gè)菜單項(xiàng)，該菜單項(xiàng)將訪問我們的主題設(shè)置頁面。

>我們可以使用WordPress菜單API創(chuàng)建菜單項(xiàng)。這是創(chuàng)建菜單項(xiàng)的代碼。

>

>在這里，主題面板是代表我們菜單項(xiàng)的唯一ID。 them_settings_page是顯示菜單API創(chuàng)建的頁面內(nèi)容的回調(diào)。我們將接下來對此功能進(jìn)行編碼。

這是外觀。

<span>function theme_settings_page(){}
</span>
<span>function add_theme_menu_item()
</span><span>{
</span>	<span>add_menu_page("Theme Panel", "Theme Panel", "manage_options", "theme-panel", "theme_settings_page", null, 99);
</span><span>}
</span>
<span>add_action("admin_menu", "add_theme_menu_item");</span>

設(shè)置api

的概述

>設(shè)置API用于填充菜單項(xiàng)API創(chuàng)建的頁面。設(shè)置頁面分為各節(jié)和字段。 為了本教程，我們將創(chuàng)建一個(gè)部分，并將所有字段都放在該部分中。

這是theme_settings_page函數(shù)的代碼以創(chuàng)建一個(gè)部分并添加提交按鈕。

<span>function theme_settings_page(){}
</span>
<span>function add_theme_menu_item()
</span><span>{
</span>	<span>add_menu_page("Theme Panel", "Theme Panel", "manage_options", "theme-panel", "theme_settings_page", null, 99);
</span><span>}
</span>
<span>add_action("admin_menu", "add_theme_menu_item");</span>

>在這里，我們使用ID部分使用settings_field注冊一個(gè)部分。主題選項(xiàng)是屬于部分的所有字段的組ID。最后，submit_button（）函數(shù)回蕩了我們主題設(shè)置頁面的提交按鈕。

這是應(yīng)該看起來的樣子。

添加社交資料URL

現(xiàn)在，讓我們在設(shè)置頁面中添加字段以存儲(chǔ)我們的Facebook和Twitter個(gè)人資料URL。幾乎每個(gè)WordPress主題都有社交個(gè)人資料選項(xiàng)，因此這是一個(gè)方便，實(shí)用的例子。

這是使用設(shè)置API添加輸入文本字段的代碼。

初始化管理面板后，我們將注冊各節(jié)和字段顯示回調(diào)。在這里，我們使用了三個(gè)重要功能：

function theme_settings_page()
{
    ?>
	    <span><span><span><div</span> class<span>="wrap"</span>></span>
</span>	    <span><span><span><h1</span>></span>Theme Panel<span><span></h1</span>></span>
</span>	    <span><span><span><form</span> method<span>="post"</span> action<span>="options.php"</span>></span>
</span>	        <span><span><?php
</span></span><span>	            <span>settings_fields("section");
</span></span><span>	            <span>do_settings_sections("theme-options");      
</span></span><span>	            <span>submit_button(); 
</span></span><span>	        <span>?></span>          
</span>	    <span><span><span></form</span>></span>
</span>		<span><span><span></div</span>></span>
</span>	<span><span><?php
</span></span><span><span>}</span></span>

add_settings_section用于顯示部分標(biāo)題和描述。

>
1. add_settings_field用于顯示字段的HTML代碼。
2. register_setting被調(diào)用以自動(dòng)保存字段值。
3. 這是我們的設(shè)置頁面現(xiàn)在的樣子。
>

>我們現(xiàn)在已經(jīng)看到了如何使用我們的設(shè)置頁面添加輸入文本字段。讓我們來看看如何通過在靜態(tài)或響應(yīng)式布局之間進(jìn)行選擇來添加復(fù)選框。

> 添加選項(xiàng)以在布局之間進(jìn)行選擇

>讓我們看看如何擴(kuò)展display_theme_panel_fields函數(shù)以顯示一個(gè)復(fù)選框以在布局之間進(jìn)行選擇。

這是實(shí)現(xiàn)此目的的代碼。

>

>我們使用add_settings_field添加了一個(gè)新的設(shè)置字段，并像往常一樣使用register_settings進(jìn)行了注冊。要注意的一件事，如果我們想確定用戶是否已選中了復(fù)選框，我們正在使用checked（）函數(shù)。

>

function display_twitter_element()
{
	?>
    	<span><span><span><input</span> type<span>="text"</span> name<span>="twitter_url"</span> id<span>="twitter_url"</span> value<span>="<span><?php echo get_option('twitter_url'); ?></span>"</span> /></span>
</span>    <span><span><?php
</span></span><span><span>}
</span></span><span>
</span><span><span>function display_facebook_element()
</span></span><span><span>{
</span></span><span>	<span>?></span>
</span>    	<span><span><span><input</span> type<span>="text"</span> name<span>="facebook_url"</span> id<span>="facebook_url"</span> value<span>="<span><?php echo get_option('facebook_url'); ?></span>"</span> /></span>
</span>    <span><span><?php
</span></span><span><span>}
</span></span><span>
</span><span><span>function display_theme_panel_fields()
</span></span><span><span>{
</span></span><span>	<span>add_settings_section("section", "All Settings", null, "theme-options");
</span></span><span>	
</span><span>	<span>add_settings_field("twitter_url", "Twitter Profile Url", "display_twitter_element", "theme-options", "section");
</span></span><span>    <span>add_settings_field("facebook_url", "Facebook Profile Url", "display_facebook_element", "theme-options", "section");
</span></span><span>
</span><span>    <span>register_setting("section", "twitter_url");
</span></span><span>    <span>register_setting("section", "facebook_url");
</span></span><span><span>}
</span></span><span>
</span><span><span>add_action("admin_init", "display_theme_panel_fields");</span></span>

checked（）函數(shù)將值與另一個(gè)值進(jìn)行比較，如果它們是相等的，則它會(huì)回蕩一個(gè)檢查屬性，否則什么都不是。

這是我們的設(shè)置頁面現(xiàn)在的外觀。

上傳徽標(biāo)

> register_setting函數(shù)采用第三個(gè)參數(shù)，該參數(shù)是回調(diào)，此回調(diào)將在將設(shè)置保存到數(shù)據(jù)庫中之前要觸發(fā)。我們可以利用此回調(diào)來處理上傳。

>

這是在我們的設(shè)置頁面上上傳徽標(biāo)的代碼。

>

>在這里，我們使用wp_handle_upload來存儲(chǔ)圖像文件并檢索其URL并將其作為選項(xiàng)存儲(chǔ)。

function display_twitter_element()
{
	?>
    	<span><span><span><input</span> type<span>="text"</span> name<span>="twitter_url"</span> id<span>="twitter_url"</span> value<span>="<span><?php echo get_option('twitter_url'); ?></span>"</span> /></span>
</span>    <span><span><?php
</span></span><span><span>}
</span></span><span>
</span><span><span>function display_facebook_element()
</span></span><span><span>{
</span></span><span>	<span>?></span>
</span>    	<span><span><span><input</span> type<span>="text"</span> name<span>="facebook_url"</span> id<span>="facebook_url"</span> value<span>="<span><?php echo get_option('facebook_url'); ?></span>"</span> /></span>
</span>    <span><span><?php
</span></span><span><span>}
</span></span><span>
</span><span><span>function display_layout_element()
</span></span><span><span>{
</span></span><span>	<span>?></span>
</span>		<span><span><span><input</span> type<span>="checkbox"</span> name<span>="theme_layout"</span> value<span>="1"</span> <span><span><?php checked(1, get_option('theme_layout'), true); ?></span></span> /></span> 
</span>	<span><span><?php
</span></span><span><span>}
</span></span><span>
</span><span><span>function display_theme_panel_fields()
</span></span><span><span>{
</span></span><span>	<span>add_settings_section("section", "All Settings", null, "theme-options");
</span></span><span>	
</span><span>	<span>add_settings_field("twitter_url", "Twitter Profile Url", "display_twitter_element", "theme-options", "section");
</span></span><span>    <span>add_settings_field("facebook_url", "Facebook Profile Url", "display_facebook_element", "theme-options", "section");
</span></span><span>    <span>add_settings_field("theme_layout", "Do you want the layout to be responsive?", "display_layout_element", "theme-options", "section");
</span></span><span>
</span><span>    <span>register_setting("section", "twitter_url");
</span></span><span>    <span>register_setting("section", "facebook_url");
</span></span><span>    <span>register_setting("section", "theme_layout");
</span></span><span><span>}
</span></span><span>
</span><span><span>add_action("admin_init", "display_theme_panel_fields");</span></span>

這是我們的設(shè)置頁面現(xiàn)在的外觀，它很好地塑造了！

>

>檢索設(shè)置

>主題需要檢索前端的設(shè)置值。設(shè)置API使用選項(xiàng)API在內(nèi)部存儲(chǔ)值。因此，您可以使用get_option（）函數(shù)檢索值。

>

非常簡單，這是代碼。

>

<span>function theme_settings_page(){}
</span>
<span>function add_theme_menu_item()
</span><span>{
</span>	<span>add_menu_page("Theme Panel", "Theme Panel", "manage_options", "theme-panel", "theme_settings_page", null, 99);
</span><span>}
</span>
<span>add_action("admin_menu", "add_theme_menu_item");</span>

結(jié)論

在本文中，我們看到了如何使用設(shè)置API輕松創(chuàng)建主題設(shè)置頁面。我們創(chuàng)建了一個(gè)文本，文件和復(fù)選框輸入字段，以各種數(shù)據(jù)格式獲取輸入。繼續(xù)嘗試擴(kuò)展頁面并自己添加更多表單控件。

>

>關(guān)于創(chuàng)建WordPress主題設(shè)置頁面的常見問題（FAQ）

> WordPress設(shè)置API是什么，為什么重要？這很重要，因?yàn)樗峁┝艘环N標(biāo)準(zhǔn)化且安全的處理數(shù)據(jù)的方式。它還可以確保您的主題或插件與WordPress生態(tài)系統(tǒng)兼容，從而使用戶更容易從WordPress管理區(qū)域管理設(shè)置。

>如何在WordPress主題設(shè)置頁面中添加新部分？ ??>

>要在WordPress主題設(shè)置頁面中添加新部分，您需要使用add_settings_section（）函數(shù)。此功能采用三個(gè)參數(shù)：本節(jié)的ID，部分標(biāo)題和輸出部分內(nèi)容的回調(diào)函數(shù)。 ID應(yīng)該是唯一的，以避免與其他部分發(fā)生沖突。

>如何在WordPress中注冊設(shè)置？

在WordPress中注冊設(shè)置，您可以使用register_setting（）函數(shù)。此功能采用三個(gè)參數(shù)：選項(xiàng)組，選項(xiàng)名稱和定義設(shè)置的參數(shù)數(shù)組。選項(xiàng)組應(yīng)匹配settings_fields（）函數(shù)中使用的組，并且該選項(xiàng)名稱是要保存在數(shù)據(jù)庫中的選項(xiàng)的名稱。

>如何為設(shè)置創(chuàng)建一個(gè)表單字段？ >

>要為您的設(shè)置創(chuàng)建一個(gè)表單字段，您可以使用add_settings_field（）函數(shù)。此功能采用多個(gè)參數(shù)，包括字段的ID，字段標(biāo)題，輸出表單字段的回調(diào)函數(shù)，應(yīng)顯示字段的頁面，應(yīng)添加字段的部分以及一系列參數(shù)對于字段。

如何驗(yàn)證和消毒我的設(shè)置？

以驗(yàn)證和消毒您的設(shè)置，您可以在register_setting（）函數(shù)中使用sanitize_callback參數(shù)。該參數(shù)應(yīng)該是一個(gè)回調(diào)函數(shù)，該函數(shù)獲取輸入數(shù)據(jù)，驗(yàn)證并對其進(jìn)行消毒，然后返回消毒數(shù)據(jù)。這樣可以確保僅保存在數(shù)據(jù)庫中。>

>如何在“設(shè)置”頁面上顯示我的設(shè)置？

在“設(shè)置”頁面上顯示您的設(shè)置，您可以使用setters_fields（）和do_settings_sections（）函數(shù)使用settings_fields（）和do_settings_sections（）函數(shù)。 settings_fields（）函數(shù)輸出設(shè)置頁面的nonce，操作和選項(xiàng)頁面字段，而do_settings_sections（）函數(shù)輸出添加到頁面上的部分和字段。 ？

為了將設(shè)置保存在WordPress中，您需要在設(shè)置頁面上提交表單。提交表單后，WordPress會(huì)使用register_setting（）函數(shù)自動(dòng)保存設(shè)置。您還可以使用update_option（）函數(shù)手動(dòng)保存設(shè)置。

>如何在wordpress中檢索我的設(shè)置？

在WordPress中檢索您的設(shè)置，您可以使用get_option（）功能。此功能將選項(xiàng)的名稱作為參數(shù)，并返回選項(xiàng)的值。如果該選項(xiàng)不存在，它將返回一個(gè)默認(rèn)值，您可以將其指定為第二個(gè)參數(shù)。

>

>如何在WordPress中刪除我的設(shè)置？>我如何對設(shè)置頁面的問題進(jìn)行故障排除？

>

以對設(shè)置頁面的問題進(jìn)行故障排除，您可以使用提供的各種調(diào)試工具由WordPress。例如，您可以使用wp_debug常數(shù)來啟用調(diào)試模式并顯示PHP錯(cuò)誤，通知和警告。您還可以使用var_dump（）函數(shù)來輸出變量的值，并查看正在處理哪些數(shù)據(jù)。

>

以上是使用設(shè)置API創(chuàng)建WP主題設(shè)置頁面的詳細(xì)內(nèi)容。更多信息請關(guān)注PHP中文網(wǎng)其他相關(guān)文章！