WordPress Custom Fields 自訂欄位 for 客製專題系列文章
啟用 WordPress Custom Fields (自訂欄位) 結合 get_post_meta() 獲取文章設定的 key 與 value,在搭配 WP_Query 查詢關聯文章,即可於佈景主題客製【專題系列文章】功能。在將 Custom Fields 整合至管理介面文章列表,即可更好查看文章屬於哪個【專題系列】。
WordPress 自訂欄位用途?
WordPress Custom Fields (自訂欄位) 可用來添加文章與頁面的其它資訊,例如本文要使用它來完成【客製專題系列文章】功能。
啟用 WordPress 自訂欄位
進入文章編輯後點擊【設定】並勾選【自訂欄位】。
這時文章最下面就會出現【自訂欄位】區塊。
客製專題系列文章
新增自訂欄位
編輯一篇要使用【專題系列】的文章後點擊【輸入新的欄位名稱】。
輸入下述資訊後點擊【新增自訂欄位】。
- 【欄位名稱】key:自訂一個【專題系列文章】專用的名稱。
- 【欄位內容】value:該文章屬於哪個【專題系列文章】。
新增自定欄位完成後點擊【儲存】或【更新】文章。
取得包含特定自訂欄位相關文章
程式碼的主要組成步驟如下:
- 使用 get_post_meta() 獲取當前文章【自訂欄位】key (名稱) 等於【專題系列文章】的第一個 value。
- 使用 WP_Query 查詢來獲取當前文章【自訂欄位】key 等於【專題系列文章】且 value 相同的文章,並依文章發佈日期舊到新排序。
- 比對是否為當前文章。
程式碼檔案路徑 /wp-content/themes/my-theme-name/template-parts/series-post.php (可依需求自行調整):
<?php
/**
* 獲取專題系列文章
*/
// 獲取當前文章【自訂欄位】Key (名稱) 等於 '專題系列文章' 的第一個 value (值)
$metaValue = get_post_meta(get_the_ID(), '專題系列文章', true);
if ($metaValue) {
// 儲存當前文章 ID (用來比對專題系列文章內是否為當前的文章)
$current_post_id = get_the_ID();
// 查詢參數
$args = array(
'meta_key' => '專題系列文章', // 【自訂欄位】key
'meta_value' => $metaValue, // 【自訂欄位】value
'orderby' => 'post_date', // 依文章發佈日期排序
'order' => 'ASC' // 依 orderby 遞減排序
);
// 執行查詢
$query = new WP_Query($args);
while ($query->have_posts()) :
$query->the_post();
// 當前文章
if ($current_post_id == get_the_ID()) {
$tablist .= '<button type="button" class="list-group-item list-group-item-success text-left">' . get_the_title() . '</button>';
// 其它文章
} else {
$tablist .= sprintf('<a href="%s" id="%s" class="list-group-item list-group-item-action" title="%s">%s</a>', esc_url(get_permalink()), basename(get_permalink()), the_title_attribute('echo=0'), get_the_title());
}
endwhile;
wp_reset_postdata();
// 如有存放資料在輸出
if ($tablist) {
echo '
<div class="col-12 mt-5 mb-3">
<strong>專題系列文章</strong>
<div class="list-group list-group-flush mt-2">' . $tablist . '</div>
</div>';
}
}
使用 get_template_part() 將 series-post.php 加載到 /wp-content/themes/my-theme-name/single.php 模板中。
<?php
get_template_part('template-parts/series-post', get_post_format());
呈現畫面
本文章範例的【專題系列文章】有 6 篇,在當前文章時會呈現綠色背景且無超連結功用,點擊其它文章即可直接連結過去,下圖實際呈現的畫面與效果可參考 Python 基礎語法。
客製管理介面文章列表欄位
客製專題系列文章完成後,為了能更好查看文章屬於哪個【專題系列】,我們需要能在管理介面的文章列表顯示【專題系列文章】欄位,並且呈現文章所設定的【自訂欄位】value。
目前管理介面文章列表所有顯示的欄位如紅框處。
添加欄位
添加【專題系列文章】欄位,並且呈現文章所設定的【自訂欄位】value,於 /wp-content/themes/my-theme-name/functions.php 添加下述程式碼:
<?php
/*
* 後台管理介面 > 使用【自訂欄位】添加文章列表欄位
*/
// 添加管理介面文章列表顯示客製欄位名稱【專題系列文章】與【自訂欄位】key 的關聯
function fm_add_post_columns($defaults){
// field vs displayed title
$defaults['專題系列文章'] = __('專題系列文章');
return $defaults;
}
add_filter('manage_posts_columns', 'fm_add_post_columns', 5);
// 呈現文章【自訂欄位】key 等於【專題系列文章】value
// Populate the new columns with values
function fm_get_post_column_values($column_name, $postID){
if($column_name == '專題系列文章'){
echo get_post_meta($postID, '專題系列文章', true);
}
}
add_action('manage_posts_custom_column', 'fm_get_post_column_values', 5, 2);
己添加【專題系列文章】欄位。
移除欄位
如果想要移除已存在的欄位 (可參考 manage_posts_columns | Hook),例如移除【作者】欄位,於 /wp-content/themes/my-theme-name/functions.php 添加下述程式碼:
<?php
/*
* 後台管理介面 > 移除文章列表不需要顯示的欄位
*/
function fm_remove_unwanted_columns($defaults){
// 移除【作者】欄位
unset($defaults['author']);
return $defaults;
}
add_filter('manage_posts_columns', 'fm_remove_unwanted_columns');
已移除【作者】欄位。
參考
本著作係採用創用 CC 姓名標示-相同方式分享 3.0 台灣 授權條款授權.