第四天:全站式的設計樣式調整

只要堅持約一小時,你就可以改好 LOGO、把網站客製化成自己喜歡的風格喔!
建立全新
WP 網站
套用版型
增加內容
編輯首頁
編輯選單
調整設計
修改樣式
安裝外掛
擴展功能
好學生推廣
加碼影片!

0.第四天的課程開始囉!

歡迎來到五天自學衝刺班部落格篇的第四天!

今天帶路姬將帶你利用幾個 Soledad佈景主題的外觀基礎設定,來進行網站外觀的微客製化:改網站的 LOGO、頁尾智慧財產權宣告的文字、首頁的排版調整等…

然而,Soledad的外觀設定選項多達上千個,透過設定的組合,可以把網站改成成千上萬種樣貌!帶路姬在今天的課程,將先教你其中七個主要項目。

誠心建議你:直接把 Soledad翻譯成中文版,再加上帶路姬另外準備的使用說明指引,就不用擔心剩下的設定都看不懂,不僅可以把網站設定的更獨特美觀、善用非常多Soledad預設的功能、減少安裝重複的外掛(節省主機資源與避免外掛衝突),還可以大幅降低把網站越改越醜、甚至改壞的風險喔!

接下來,今天接下的影片,還會幫助你了解,佈景主題所提供的外觀客製化的選項真的超級多!

 

  1. 所以才能用同一個佈景主題,做出幾百個看起來差別很大的示範網站!
  2. 每個佈景主題的自訂項目與分類的方式都不一樣喔!所以如果能找到比較完整的教學(像帶路姬的五天自學衝刺班),真的會比較有頭緒一些!
  3. 很多免費的佈景主題,大概就是把 外觀 > 自訂裡 的選項 90%都鎖起來,讓你體驗看看他的用法、看看選項是如何分類的而已,不過大部分的細部設定是需要付費升級(甚至每年續約)才能解鎖使用的,順帶提一下讓大家有點概念囉🥰! 

1. 如何換掉 Logo與調整選單樣式?

只要與全站式樣式相關的設定,都可以到 外觀>自訂去找找看喔!

 跟著影片操作就可以了喔! 15’48”

如何換 Logo:
  1. 到網站後台的 外觀>自訂
  2. 點選 Logo & Header
  3. 點選 Logo,並且點選變更圖片,就可以換成你的 Logo 圖片
如何改變頁首區域的排版:
  1. 到網站後台的 外觀>自訂
  2. 點選 Logo & Header
  3. 點選 General
  4. Header Layout 處,可以選擇不同的排版樣式(有的 Logo 置中,有的 Logo 在左邊等等,可以參考 Soledad 示範網站
如何調整選單樣式:
  1. 到網站後台的 外觀>自訂
  2. 點選 Main Bar & Primary Menu

2.如何修改側邊欄的小工具內容與樣式?

側邊欄的標題有些預設的樣式可以選擇、側邊欄的標題樣式設定等等

重要觀念+操作 21’50” 

什麼是小工具?
  1. 側邊欄與頁尾資訊欄中,可以加入一個區塊一個區塊的小工具,作為次要資訊的補充
  2. 外觀 > 小工具,可以編輯小工具
  3. 只要展開你想編輯的小工具區域就可以編輯裡面的小工具,像是 Main Sidebar 是主要側邊欄區域,Footer Column1~Footer Column3則是頁尾資訊欄的三個欄位,可分別插入小工具。
  4. 編輯小工具的方式很簡單,和文章一樣,都是使用「區塊編輯器
關於小工具的標題的樣式:
  1. 到網站後台的 外觀 > 自訂 > Sidebar > General > Sidebar Widget Heading Style ,選擇你喜歡的樣式
  2. 也可以到網站後台的 外觀 > 自訂 > Sidebar > Colors,調整看看相關的顏色

3. 如何調整頁尾與智慧財產權區域的樣式?

頁尾區域和頁首區域一樣,都是全站共用的喔!

 跟著影片操作就可以了喔! 7’11”

如何調整頁尾樣式:
  1. 到網站後台的 外觀>自訂
  2. 點選 Footer 頁尾
  3. 點選 General,有很多和頁尾相關的設定
  4. 最下面 Footer Copyright Text 處,可以填入智慧財產權宣告

4. 在頁面中列出文章的方式有兩種!

用頁面編輯器插入文章列表,或者從選單加入分類

重要觀念+操作:11’51”

  1. 如果是使用 Elementor來編輯頁面,可以插入 Penci Latest Posts 元素,來列出文章,還可以指定只顯示某個分類,上下還可以插入其他內容元素,讓頁面排版更豐富!
  2. 如果不使用 Elementor 頁面編輯器,也可以到 外觀>選單,加入文章分類到選單中,讓 WordPress 自動幫你彙整該分類的文章到一個彙整頁面中,只是這個頁面的上下就沒辦法再加其他內容囉

5. 如何修改單篇文章的排版與樣式?

可以指定文章的排版方式、顯示或隱藏文章中的內容以外的資訊、調整文字大小等等...

可以先參考,如果有需要才調整,非必做項目: 9’08”

  1. 到網站後台的 外觀>自訂
  2. 點選 Single Posts 單篇文章
  3. 點選 General 一般設定
  4. Single Posts Template 處,可以指定你喜歡的排版方式(可以參考 Soledad 示範網站
  5. 還有很多選項來顯示或隱藏下方的一些元素喔!

6. 如何編輯社群連結與設定社群分享?

可以指定他們是否要顯示?要顯示在哪裡等等...

可以先參考,如果有需要才調整,非必做項目:7’21”

  1. 設定社群連結:到網站後台的 外觀>自訂 > Social Media,填入社群連結
  2. 設定社群分享的圖示:要看這些圖示出現在什麼地方,想要設定他們為顯示或是隱藏,設定的地方都是不同的喔!(請參考影片)

今天的課程上完囉!礙於課程篇幅,帶路姬無法把所有設定都一個一個仔細講解,因此帶路姬直接準備了 Soledad的中文版翻譯包以及使用說明指引,相信一定能幫助你更直覺的操作啦!不僅可以把網站設定的更獨特美觀、善用非常多Soledad預設的功能、減少安裝重複的外掛(節省主機資源與避免外掛衝突),還可以大幅降低把網站越改越醜、甚至改壞的風險喔!

你真是太厲害了!又多完成了一天啦!
只剩下第五天了!成功是給堅持下去的人的喔!

建立全新
WP 網站
套用版型
增加內容
編輯首頁
編輯選單
調整設計
修改樣式
安裝外掛
擴展功能
好學生推廣
加碼影片!

歡迎分享課程

歡迎贊助帶路姬

留言給帶路姬吧!

* By using this form you agree with the storage and handling of your data by this website.


1 留言

2021-02-12 - 12:24 上午

Hello~我想問要如何調整logo的大小?不知道連結可不可以點進去,可以試試看

回答
訂閱電子報 (週四寄)
帶路姬的文章重質不重量,所以請訂閱我的電子報,以確保會收到更多優質教學好文喔!
聯盟分潤聲明

此站內容為Erin的真實架站經驗分享,部分推薦的商品有參加 聯盟計畫,您若點選文中的連結而購買商品,Erin可以從中獲取一點分潤。不過Erin 100%保證,只誠懇推薦自己親身試用過的好東西。(什麼是聯盟計畫?)

支持帶路姬

假如你很喜歡帶路姬的文章,希望鼓勵帶路姬繼續寫作,幫助WordPress新手,與推廣WordPress,不如贊助一下帶路姬吧!

追蹤帶路姬
帶路姬人氣

網站成立:2018/05/01
總瀏覽量:2,614,479(2024/2/2)
總訪客量:626,454 (2024/2/2)

© WordPress 網站帶路姬 2018~2025 版權所有 |  本站使用 Soledad主題 + Elementor Pro 編輯器   | 推薦使用 Cloudways主機

本網站使用 Cookies 來提升您的使用體驗。我們將假設您同意這項安排,但如果您希望,您可以選擇拒絕。 接受 閱讀更多

帶路姬熱銷書籍