如何更改WordPress詩句樣式，並一鍵套用到整個網站?

本篇文章，將會教你該如何使用程式碼片段外掛，更改整個 WordPress 網站的詩句樣式。包括更改詩句背景顏色、邊框顏色+粗細、填充寬度等等，省卻了過往想自訂詩句樣式，還必須在文章編輯器中一個詩句一個詩句更改的麻煩。

目錄隱藏

使用教學
如何使用詩句?
最終樣式

使用我們開發的 Make 工具將文章自動化！

「數位果子」提供全自動化的文章生成工具，
我們經過實戰，知道如何透過這工具快速提升流量，
聯絡我們，免費了解 全自動化 AI 內容生成工具！

聯繫方式：

電話：0970-357-535（程先生）

加我 LINE ID：cherng65

0 0 選票

文章評分

如果對文章內容有任何問題，或有想讓小翔另外補充的的內容，歡迎在底下留言讓我知道。

在這裡，我想讓您知道在 小翔教你SEO 網站中，有些連結為聯盟營銷連接，這代表，當人們點擊該連結，並前往其他網站進行購買動作時，我將會從銷售中獲得少部分佣金（但不會影響你購買的價格）。

有關更詳細的聯盟連接說明，請前往聯盟計畫聲明（FTC）頁面觀看。

by 小翔

使用教學

為了方便代碼的管理，本人是使用了程式碼片段外掛來更改樣式，這樣未來如果想要修改代碼會比較方便快速。

step 1

使用我們開發的 Make 工具將文章自動化！

聯繫方式：

電話：0970-357-535（程先生）

加我 LINE ID：cherng65

0 0 選票

文章評分

首先，前往外掛 > 安裝外掛，搜尋「Code Snippets」，如下圖所示，找到名稱為 Code Snippets 的外掛，立即安裝並啟用該外掛。

Code Snippets 外掛 :
https://tw.wordpress.org/plugins/code-snippets/

step 2

外掛啟用後，網站後台的左半邊會多出 程式碼片段 這個選項，點擊 程式碼片段 中的「新增程式碼片段」。

step 3

複製以下的程式碼。如下圖所示，在 程式碼輸入框 中貼上該程式碼，並更改程式碼名稱為「更改整個網站詩句樣式」，方便程式碼與程式碼之間的管理，也方便快速找到並修改該程式碼。

程式碼 :

/*
如何更改WordPress詩句樣式?
https://xiaoxiang.blog/verse-style
*/
add_action( 'wp_head', function () { ?>
<style>

	pre.wp-block-verse {
		background: #f7f8f9;
		/*詩句背景顏色*/
		padding: 1em;
		/*詩句填充寬度*/
		border:1.6px solid #eaeaea
		/*詩句邊框粗細、顏色*/	
	}

</style>
<?php } );

畫面 :