如何在 WordPress 中更改字體顏色

已發表: 2020-06-04

網站的配色方案反映了整體用戶體驗,因為它決定了您網站的外觀。 WordPress 中可能有多個免費或付費主題,但仍有改進的餘地。 這種改進可以通過更改背景甚至自定義字體顏色來實現。 在本文中,您將學習如何在 WordPress 中更改字體顏色。

內容
1顏色注意事項
2第 1 步:主題驗證
3第 2 步:字體檢查面板
4第 3 步:預覽
5第 4 步:插入 CSS 樣式以更改字體顏色
6如何更改特定帖子或頁面的 WordPress 中的字體顏色

顏色注意事項

顏色是排版的重要組成部分,可幫助您添加亮點以吸引客戶。 如果你有一個簡單的網站,白色背景,沒有多餘的顏色,那麼你就像是定制領域的門外漢。 有時,人們嘗試過多的顏色組合會導致可讀性差。 最重要的是,您的字體應該受到訪問者的青睞。

因此,您必須選擇不與背景混合的顏色。 深色與淺色背景形成對比。 在許多地方,黑色是默認設置,但可以更改為其他較暗的顏色。 深色字體顏色與深色背景不匹配。 例如,如果您使用黑色和深藍色,它會與背景融為一體,難以閱讀。

然而,較淺的顏色有助於從背景中脫穎而出。 需要優先考慮網站設計以及品牌色彩。 如果您的品牌有特定的顏色,那麼您還可以為字體實現相同的顏色或匹配的顏色。 此外,這有助於填補讀者心中的色彩振動。

讓我們探索以充分利用您的主題。

第 1 步:主題驗證

首先,您需要驗證您的主題是否具有更改字體顏色的選項。

要進行驗證,請從您的管理儀表板轉到外觀 > 自定義

根據主題,可能會有不同的自定義設置。 您所要做的就是為字體顏色找到適當的自定義設置。 在我們的主題中,顏色設置在常規設置中。 在您的情況下,它可能位於不同的位置。

更改主題中的字體顏色
如何更改 WordPress 主題中的字體顏色

如您所見,我們可以從此設置更改背景顏色和標題文本顏色。

在這裡,我們可以更改主題提供的模板顏色、標題文本顏色或背景顏色

為了選擇自定義顏色,我們可以導航它直到找到我們的顏色。 您還可以保留一個十六進制代碼,以防您需要特定的顏色。 如果你想知道顏色的十六進制代碼,那麼你可以使用 W3Schools 提供的HTML Color Picker 。 發布以進行這些更改。

現在讓我們看看如何更改 WordPress 中的字體顏色。 CSS。

第 2 步:字體檢查面板

確保您有 Chrome 瀏覽器或 Firefox 來運行此檢查。 首先,打開您的網站。 查看您要更改的任何字體項目。 右鍵單擊它並單擊檢查(Chrome)/檢查元素(Firefox)。

您將看到兩個新窗格在同一窗口中並排或上下排列。 在一個窗口中,您將看到元素,而在另一個窗口中,您可以檢查它們的樣式。 在這裡,不同的線代表不同的元素。 現在,選擇要更改的字體,如下所示:

字體檢查面板

這將在同一元素的另一個窗格中顯示關聯的樣式。 您需要找到適用於您的主題的那個。

這裡,“p”代表段落,而“entry-content”執行選擇頁面和帖子內容的角色。 您可以進一步看到它在樣式窗格中可用。

選擇括號內提供的任何現有樣式。 因此,您將獲得一條新線路。

您可以輸入“顏色”字段並選擇您選擇的顏色。 當您在輸入字段後按 Tab 鍵時,它將顯示該字段下的可用選項列表。 如果您知道任何顏色的十六進制值或 RGB,那麼您也可以提及它們。

第 3 步:預覽

當您對樣式進行這些更改時,頁面上的文本會實時更改。 這有助於您在保存這些樣式更改時查看頁面的真實視圖。

看到這些更改後,如果您想編輯更多內容,則可以重複該過程,直到滿意為止。 您可以多次試驗和測試,因為您只會觀察這些變化。 最後,當您獲得您選擇的顏色時,右鍵單擊並從瀏覽器中復制整個規則。

讓我們繼續插入 CSS 樣式。

第 4 步:插入 CSS 樣式以更改字體顏色

從您的管理儀表板轉到外觀 > 自定義 > 附加 CSS

這會在新窗口中為您的主題打開自定義 CSS。 您將在此窗口中看到與 CSS 相關的內容。

在這裡,將您之前複製的樣式粘貼到頁面底部。 您必須刪除複製文本中的所有其他行,除了“顏色”行。

如果要保存這些更改,請點擊“發布”按鈕。 這是使用 CSS 樣式更改字體顏色的最佳方法。

如何更改特定帖子或頁面的 WordPress 中的字體顏色

當您在管理儀表板中時,打開要編輯的帖子/頁面。 單擊編輯選項。 打開特定帖子後,單擊右側的阻止。 您將在那裡看到顏色設置和高級設置。 借助顏色設置,您將能夠更改塊的各個背景顏色以及文本顏色。 此外,高級設置允許您添加 CSS 類。 如果要添加多個 CSS 類,則使用逗號分隔。

如何更改 WordPress 帖子或頁面中的字體顏色

此外,您還可以單擊自定義顏色來選擇顏色。 除非您獲得所需的顏色,否則可以使用滑塊。 顏色選擇器可幫助您搜索新顏色。 事實上,您還可以獲得與您的品牌相匹配的顏色。

如果您知道顏色代碼,您也可以直接輸入十六進制代碼。 在段落塊的情況下,此方法可用於設置文本和背景的顏色。 但是,我們可以期待這種自定義選項在未來也會出現在其他塊類型中。

包起來

希望這將使您更容易學習如何在 WordPress 中更改字體顏色。 如果您有任何進一步的疑慮,請隨時將其放在下面。

附加讀物

如何在 WordPress 中更改字體大小
WordPress禁用主題編輯器
最新的 WordPress 新聞