鑰匙要點

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

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

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

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

>

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

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

>我們可以使用WordPress菜單API創(chuàng)建菜單項。這是創(chuà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用於填充菜單項API創(chuàng)建的頁面。設(shè)置頁面分為各節(jié)和字段。 為了本教程，我們將創(chuàng)建一個部分，並將所有字段都放在該部分中。

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

<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註冊一個部分。主題選項是屬於部分的所有字段的組ID。最後，submit_button（）函數(shù)迴盪了我們主題設(shè)置頁面的提交按鈕。

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

添加社交資料URL

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

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

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

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)用以自動保存字段值。
3. 這是我們的設(shè)置頁面現(xiàn)在的樣子。
>

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

> 添加選項以在佈局之間進(jìn)行選擇

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

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

>

>我們使用add_settings_field添加了一個新的設(shè)置字段，並像往常一樣使用register_settings進(jìn)行了註冊。要注意的一件事，如果我們想確定用戶是否已選中了複選框，我們正在使用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ù)將一個值與另一個值進(jìn)行比較，如果它們是相等的，則它會迴盪一個檢查屬性，否則什麼都不是。

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

上傳徽標(biāo)

>

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

>

>在這裡，我們使用wp_handle_upload來存儲圖像文件並檢索其URL並將其作為選項存儲。

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

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è)置

>主題需要檢索前端的設(shè)置值。設(shè)置API使用選項API在內(nèi)部存儲值。因此，您可以使用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)建了一個文本，文件和復(fù)選框輸入字段，以各種數(shù)據(jù)格式獲取輸入。繼續(xù)嘗試擴(kuò)展頁面並自己添加更多表單控件。

>

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

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

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

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

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

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

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

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

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

以驗證和消毒您的設(shè)置，您可以在register_setting（）函數(shù)中使用sanitize_callback參數(shù)。該參數(shù)應(yīng)該是一個回調(diào)函數(shù)，該函數(shù)獲取輸入數(shù)據(jù)，驗證並對其進(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，操作和選項頁面字段，而do_settings_sections（）函數(shù)輸出添加到頁面上的部分和字段。 ？

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

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

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

>

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

>

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

>

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