專注於架設企業網站,分享WordPress教學和Elementor教學

GeneratePress:全域顏色設置教程

更新日期:2023-08-24
本系列教學
加入讀者學習群
我用的頁面編輯器
讓我的客戶網站GTmetrix測分A\A的主機Cloudways
黑五優惠前4個月6折, 戳上方按鈕註冊即可自動帶入優惠碼BFCM2024
所贈主題外掛程式價值>$49
主機送Astra Pro不限網站1年
gmail.comsina.com邮箱,注册易通过
遇到問題,聯繫我

本教程講解如何在GeneratePress主題中配置網站的全域顏色。

您可以在自定義(customize) > 顏色(colors)中找到GeneratePress主題的全域顏色(global colors)配置項。

打開顏色面板後,您將下圖中的全域顏色和元素列表。

GeneratePress:全域顏色設置教程

全域顏色

GeneratePress主題預設添加了 7 種顏色,每種顏色都有特定的用途。

從左到右,分別有如下顏色:

  • 對比色(contrast)——最深的文字顏色
  • 對比色 2 – 較淺的文字顏色
  • 對比色 3 – 最淺的文字/邊框顏色
  • 基礎(base) – 深色背景
  • 基礎 2 – 較淺的背景
  • 基礎 3 – 最淺的背景(白色)
  • 強調(accent)——品牌主色調

您可以刪除或重新命名這些預設顏色。但是,如果您這樣做,您需要更新使用了這些已刪除或重命名顏色的顏色欄位,因為這些欄位將不再具有顏色值。

您還可以根據需要添加任意數量的自訂顏色。 注意,要保持您的全域顏色的簡單和最小化——這些顏色是您將在整個設計和內容中重複使用的顏色。 這裡的好處是:您可以隨時更換顏色以完全改變您網站的風格。

對比色

GeneratePress:全域顏色設置教程

對比色通常是文字/邊框顏色。

基礎色

GeneratePress:全域顏色設置教程

基礎色通常是您的背景色。 這些顏色和您的對比色之間應該有足夠的對比度,以便您的文本仍然容易看清。

強調色

GeneratePress:全域顏色設置教程

您的強調色是您網站上使用最少的顏色。 它們旨在吸引注意力(鏈接、按鈕、特殊標題等…… )。

為元素選擇顏色

你可以將將滑鼠點選需要配置的元素,譬如primary navigation(菜單),在展開的配置項里,將懸停在顏色選項上以瞭解每個選項的用途。

例如:初始(initial)/懸停(hover)/當前選中(current)顏色選項,你可以為主菜單和子菜單設置背景、文本、子菜單的不同顏色。

GeneratePress:全域顏色設置教程

選擇顏色的操作很簡單,你可以單選一個全域顏色,或根據需要選擇新的顏色。

GeneratePress:全域顏色設置教程

查看更多GeneratePress主題教程

点赞

0 / 5 0

Your page rank:

Picture of 外貿建站技術姐Bonnie
外貿建站技術姐Bonnie

Bonnie是LOYSEO的創始人,在建站領域有著超過14年的經驗,熱愛能將想法變為現實的WordPress,更是Elementor的忠實使用者~

LOYSEO
讓我的客戶網站GTmetrix測分A\A的主機Cloudways
黑五優惠前4個月6折, 戳上方按鈕註冊即可自動帶入優惠碼BFCM2024
所贈主題外掛程式價值>$49
主機送Astra Pro不限網站1年
gmail.comsina.com邮箱,注册易通过
遇到問題,聯繫我