如何在WordPress帖子和帖子類型中添加自定義元框


您是否要為WordPress帖子,頁面和自定義帖子類型創建自定義meta框? 自定義元框通常用於提供更好的用戶界面,以將自定義字段(元數據)添加到您的內容中。 在本文中,我們將解釋什麼是自定義meta框,以及如何輕鬆地在WordPress帖子和帖子類型中添加自定義meta框。

如何在WordPress帖子中添加自定義元框

WordPress中的自定義元框是什麼?

自定義元框是一個更加用戶友好的界面,用於在您的帖子,頁面和其他自定義帖子類型中添加自定義字段(元數據)。

WordPress帶有易於使用的界面,可幫助您創建帖子和頁面等內容或自定義帖子類型。

通常,每種內容類型均由實際內容及其元數據組成。 元數據是與該內容相關的信息,例如日期和時間,作者姓名,標題等。 您還可以使用自定義字段添加自己的元數據。

自訂欄位

但是,使用默認自定義字段框添加元數據不是很直觀。 這是自定義元框出現的地方。

WordPress允許開發人員在後期編輯屏幕上創建並添加自己的自定義元框。 這就是大多數流行的插件在您的帖子編輯屏幕上添加不同選項的方式。

例如,Yoast SEO插件內的SEO標題和元描述框是一個自定義元框:

Yoast SEO中的類別SEO標題和元描述

話雖如此,讓我們看看如何輕鬆地在WordPress帖子和帖子類型中添加自定義元框。

在WordPress中創建自定義元框

首先,您需要做的是安裝並激活Advanced Custom Fields插件。 有關更多詳細信息,請參閱有關如何安裝WordPress插件的分步指南。

激活後,插件會在您的WordPress管理欄中添加一個名為“自定義字段”的新菜單項。 單擊它會將您帶到自定義字段頁面。

由於您尚未創建任何自定義字段,因此該頁面將為空。 繼續並單擊“添加新”按鈕以繼續。

添加新的自定義字段組

您將被帶到“添加新字段組”頁面。

在這裡,您需要為字段組提供標題。 該標題將用作您的元框的標題。

之後,您可以開始添加字段。 只需單擊“ +添加字段”按鈕即可添加您的第一個字段。

添加你的拳頭領域

這將顯示字段設置表單。 首先,您需要為您的字段提供標籤。 該標籤將顯示在該字段之前的元框中。

為您的自定義元框創建一個新字段

之後,您需要選擇字段類型。 高級自定義字段插件可讓您從所有選項中進行選擇。 這包括文本,文本區域,單選按鈕,複選框,完整的WYSIWYG編輯器,圖像等。

接下來,您需要提供現場說明。 這些說明將告訴用戶要添加到字段中的內容。

在此之下,您將找到該字段的其他選項。 您需要仔細查看這些選項,並進行調整以滿足您的需求。

欄位設定

接下來,單擊關閉字段按鈕以折疊該字段。

如果需要將更多字段添加到您的元框,請單擊“ +添加字段”按鈕以添加另一個字段。

關閉字段並添加另一個

完成添加字段後,您可以向下滾動到位置部分。 您可以在此處定義希望顯示元框的時間和位置。

位置規則

高級自定義字段附帶了一些預定義的規則供您選擇。 例如,您可以選擇帖子類型,帖子類別,分類法,頁面父級等等。

接下來是meta框選項設置。

首先,您需要選擇訂單號。 如果您為一個地點定義了多個字段組,則可以選擇要顯示的訂單號。 如果不確定,則將其保留為0。

元框選項

接下來,您需要選擇頁面上的meta框位置。 您可以選擇在內容之後,內容之前或右列中顯示它。

在此之下,您將需要為元框選擇一種樣式。 您可以選擇它像其他所有WordPress meta框一樣,也可以選擇無縫(沒有任何meta框)。

如果不確定,請選擇“標準(WP Meta框)”選項。

最後,您將看到通常在帖子編輯屏幕上顯示的字段列表。 如果要在帖子編輯屏幕上隱藏特定字段,則可以在此處進行檢查。 如果不確定,則最好不要選中它們。

完成後,單擊“發布”按鈕以使您的字段組生效。

發布您的領域組

恭喜,您已成功為WordPress帖子或帖子類型創建了自定義元框。

根據您的設置,您現在可以訪問您的帖子或帖子類型,以查看您的自定義元框的使用情況。

自定義metabox預覽

您可以使用此自定義元框將元數據添加到您的帖子或帖子類型中。 保存或發布帖子時,這些數據將存儲在WordPress數據庫中。

在WordPress主題中顯示您的自定義元框數據

到目前為止,我們已經成功創建了一個自定義元框,並將其顯示在我們的帖子編輯屏幕上。 下一步是在WordPress主題上顯示存儲在這些字段中的數據。

首先,您需要編輯您先前創建的自定義字段組。 在“編輯字段組”頁面上,您將看到您的自定義字段及其名稱。

欄位名稱

您將需要這些字段名稱才能在您的網站上顯示它們。

高級自定義字段允許您以兩種不同的方式執行此操作。

首先,您可以使用簡碼在帖子中顯示自定義字段。

[acf field="article_byline"]

您還可以通過將代碼添加到WordPress主題文件中來顯示它們。 如果您以前沒有做過,請查看我們的初學者指南,了解如何在WordPress中復制和粘貼代碼。

您將需要編輯主題文件,以便在其中顯示這些字段中的數據。 例如,single.php,content.php,page.php等。

您需要確保將代碼添加到WordPress循環內。 確保在循環內輸入代碼的最簡單方法是在代碼中查找如下所示的行:


您可以在此行之後和結束循環的行之前粘貼代碼:


您的自定義域代碼如下所示:


此代碼將顯示輸入到我們的自定義元框的文章按行字段中的數據。

注意我們如何使用CSS類將代碼包裝在h2標題中。 通過在自定義主題中添加自定義CSS,這將有助於我們稍後對自定義字段進行格式化和样式設置。

這是另一個示例:

不要忘記用您自己的字段名替換字段名。

現在,您可以訪問已在其中將數據輸入到自定義字段中的帖子。 您將能夠看到顯示的自定義元數據。

網站上顯示的自定義字段

Advanced Custom Fields是一個非常強大的插件,具有很多選項。 本教程僅涉及表面知識。 如果您需要更多幫助,請不要忘記查看該插件的文檔以了解如何進一步擴展它。

我們希望本文能幫助您學習如何在WordPress帖子和帖子類型中添加自定義元框。 您可能還希望查看有關如何為初學者提高WordPress速度和性能的分步指南。

如果您喜歡這篇文章,請訂閱我們的YouTube頻道WordPress視頻教程。 您也可以在找到我們 推特 和Facebook。