以下是一個描述如何新增 meta_description 自定義欄位的 文件。文件包括程式碼的說明和結構，幫助你將程式碼整合到 WordPress 中，實現自定義頁面描述的功能。
程式碼的新增路徑在主題資料夾下的functions.php，例如：
/opt/homebrew/var/wordpress/wp-content/themes/twentytwentyfour/functions.php
WordPress Meta Description 自定義欄位整合指南
本文件將指導你如何在 WordPress 中為頁面和文章新增一個 meta_description 欄位，用於設定頁面的自定義 meta description。該欄位不僅可以在編輯介面中進行設定，還能顯示在 REST API 中，以便進一步整合。
功能概述
註冊 Meta Description 自定義欄位：在 WordPress 中建立並註冊一個
meta_description欄位，允許在 REST API 中顯示。動態生成 Meta Description 標籤：自動生成
<meta name="description">標籤，並輸出到<head>中。為頁面和文章新增 Meta Description 編輯框：在頁面和文章的編輯介面中增加一個輸入框，便於手動設定
meta_description。儲存自定義欄位：確保欄位值在儲存文章或頁面時被儲存到資料庫中。
1. 註冊 Meta Description 自定義欄位
首先，在 WordPress 中註冊 meta_description 自定義欄位。此欄位被指定為一個單值欄位（single），型別為字串（string），並且在 REST API 中顯示。
function register_meta_description_field() {
register_post_meta('page', 'meta_description', [
'show_in_rest' => true, // 允許在REST API中顯示
'type' => 'string',
'single' => true, // 設定為單值欄位
'description' => 'Meta Description for the page',
]);
}
add_action('init', 'register_meta_description_field');
2. 動態生成 Meta Description 標籤
此功能會根據頁面或文章標題生成 meta_description。如果標題以 "Demo App for" 開頭，則動態生成 meta description；否則，優先讀取自定義欄位的內容。
function add_meta_description() {
if (is_singular()) {
$title = get_the_title();
if (strpos($title, 'Demo App for') === 0) {
$processed_title = preg_replace('/^Demo App for\s*/', '', $title);
$meta_description = "Begin {$processed_title} something end.";
} else {
$meta_description = get_post_meta(get_the_ID(), 'meta_description', true);
if (empty($meta_description)) {
return;
}
}
echo '<meta name="description" content="' . esc_attr($meta_description) . '">';
}
}
add_action('wp_head', 'add_meta_description');
3. 為頁面和文章新增 Meta Description 編輯框
在文章和頁面編輯介面新增一個輸入框，允許使用者手動輸入 meta description。
function add_meta_description_meta_box() {
add_meta_box(
'meta_description_meta_box', // HTML ID
'Meta Description', // 標題
'display_meta_description_meta_box', // 回撥函式
['post', 'page'], // 適用文章和頁面
'normal', // 放置位置
'high' // 優先順序
);
}
add_action('add_meta_boxes', 'add_meta_description_meta_box');
function display_meta_description_meta_box($post) {
$meta_description = get_post_meta($post->ID, 'meta_description', true);
?>
<label for="meta_description">Meta Description:</label>
<textarea name="meta_description" id="meta_description" rows="4" style="width:100%;"><?php echo esc_textarea($meta_description); ?></textarea>
<?php
}
4. 儲存 Meta Description 欄位
確保在儲存文章或頁面時，meta_description 欄位的值被安全儲存到資料庫中。
function save_meta_description_meta_box($post_id) {
if (defined('DOING_AUTOSAVE') && DOING_AUTOSAVE) return;
if (!current_user_can('edit_post', $post_id)) return;
if (isset($_POST['meta_description'])) {
update_post_meta($post_id, 'meta_description', sanitize_text_field($_POST['meta_description']));
}
}
add_action('save_post', 'save_meta_description_meta_box');
總結
此文件介紹瞭如何在 WordPress 中註冊、動態生成並手動編輯 meta_description 欄位，為你的 WordPress 頁面和文章新增自定義的 meta description。透過這種方式，你可以在前端 SEO 最佳化和編輯靈活性上取得平衡。
提示：在註冊欄位時設定 show_in_rest 為 true，確保該欄位可在 REST API 中顯示，從而支援其他應用的進一步整合。
作者：大菜果果
連結：https://juejin.cn/post/7436252096360890377
