WordPress 客製後台 – 變更不同狀態下文章列表欄位背景色

變更不同狀態下文章列表欄位背景色

WordPress 客製後台, 變更不同狀態下文章列表欄位背景色:

1. 自定文章列表背景色

WordPress 客製後台 與網站前端其實沒有關係,而是為了變更 WordPress 預設的功能及樣式,讓管理員能在編輯網站時能以更有效率的方式來操作,而本篇教學要說明的就是以加入 function 函數的方式,來改變 WordPress 文章列表中不同狀態欄位的顏色,為的是讓管理員在編輯文章時能更快速辨認當前文章屬於哪一種狀態,就實際操作面而言相當實用。

WordPress Codex:https://codex.wordpress.org/
WordPress Code Reference:https://developer.wordpress.org/reference/functions/add_action/
w3schools CSS color:https://www.w3schools.com/cssref/css_colors.asp

• 使用函數定義文章狀態背景顏色

第一步:下方是改變文章欄位顏色所需要的函數,內容上為對 posts_status_color 這個位置 做 style 的設定,將每一種文章狀態所具有的 class 加入並指定十六進位色碼後,再以 add_action 定義執行位置,就能完成對文章欄位背景色的修改。

第二步:在外觀中點選佈景主題編輯器,選擇子主題模板,開啟 functions.php 檔案,將程式碼貼到結尾處後點選更新檔案,如下圖所示。

WordPress 客製後台

第三步:完成後回到文章項目中,可以看到不同的文章狀態會顯示不同的背景顏色,想要篩選文章時會更加方便。

WordPress 客製後台

 

結語:

今天的教學到這裡告一段落了,不要忘記在右側訂閱鵠學苑電子報,確保收到最新 WordPress 教學文章,如果有網頁設計相關需求,或者想了解最新網站知識,也可以到 鵠崙設計 做線上免費諮詢喔!我們下次的教學見~

WordPress PHP 自訂網站 相關教學文章:

WordPress shortcode 函式教學 – 建立自定義短碼顯示文字及圖片

WordPress 禁用 Gutenberg 編輯器的兩種方法(外掛與函數)

WordPress 小工具 ( Widget ) 增加自定義模組區塊( OceanWP)

WordPress 自訂欄位,網站後台公佈欄自訂資訊內容,PHP語法應用

WordPress 自訂媒體庫,使用函數限制文章特色圖片最小寬度及高度

關閉WordPress圖片自動縮圖 – 提升整體網站速度及載入網頁速度

網站架設知識推薦閱讀:

Chrome 移除蓋版廣告?Google 12 項廣告體驗規範簡易說明

Google One 介紹 – 全新雲端硬碟方案,擴充更多儲存空間!

無障礙網站介紹-規範說明、檢測工具與操作影片

鵠學苑

鵠學苑

我們是由一群熱愛 WordPress 網站架設的同好所組成的團隊,希望可以將這套 頂尖的 CMS 管理系統推廣給想要架站的朋友們,並且能夠在過程中互相交流心得,讓網站架設過程變得更有效率!

訂閱電子報

立即訂閱鵠崙設計(鵠學苑)!我們將不定期發送架站教學文章、最新網站版型介紹以及網頁設計最優惠價格!

熱門文章

最新文章

相關文章

標籤雲

Sign up for our Newsletter

Click edit button to change this text. Lorem ipsum dolor sit amet, consectetur adipiscing elit

Scroll to Top