WordPress不懂程式0-1 自架部落格 | 佈景主題SOLEDAD(基礎設定篇)

by 點子
WordPress不懂程式0-1 自架部落格 | 佈景主題SOLEDAD(基礎設定篇)
WordPress不懂程式0-1 自架部落格 | 佈景主題SOLEDAD(基礎設定篇)

WordPress不懂程式0-1 自架部落格 | 佈景主題SOLEDAD(基礎設定篇)

恭禧你來到了這一篇!這表示你已經完成了主機+網域的設定,也下載設定完成了Soledad佈景主題

如果都還沒請參考

從這篇開始,你要開始為你的網站打基礎囉!點子將一步步手把手的帶你操作基本設定的流程,跟著點子開始吧!


認識佈景主題SOLEDAD基本架構

WordPress不懂程式0-1 自架部落格 | 佈景主題SOLEDAD(基礎設定篇)
網站自訂

1.我們進入網站前台,可以看到你已經將想要套用的Soledad佈景主題版型設定完成了,(Soledad佈景主題 有非常多種模板可以套用-可以看WORDPRESS不懂程式0-1 自架部落格 | 佈景主題SOLEDAD(下載設定篇) 設定)

2.點選左上角的自訂

Soledad佈景主題 的基本功能,都是在這邊設定完成的哦!(後台的"外觀>自訂",同樣是可以進入設定的頁面)

WordPress不懂程式0-1 自架部落格 | 佈景主題SOLEDAD(基礎設定篇)
認識基本架構

3. Soledad佈景主題 主要的列表有非常多的功能,細節也非常多,本篇是基礎的架構設定,我將會依照我個人使用過的經驗一步步帶著你一起設定。


一般設定(General)

WordPress不懂程式0-1 自架部落格 | 佈景主題SOLEDAD(基礎設定篇)
自訂>General>General Settings

自訂>General>General Settings

General為網站全局的設定,如果在後續制作上需要做各別客制化的設定,還是可以在各別的選項中設定。

1.網頁路徑 – 如果你希望你的觀眾知道這個是由什麼樣的分類所看到的文章,選擇不要勾選。(勾選為不顯示)

2.日期顯示為最新修改日期 – 在點進你的文章之前,簡介的地方會顯示的日期,沒有勾選為顯示文章上架日期,勾選為顯示最新修正日期。

3.粘性側邊欄 – 勾選後,側邊欄會跟隨著你的文章一直拉到最後,若沒有勾選,則滑動時測邊欄不會跟著一起走。

4.設定圖標 – 顯示在網站分頁上的小圖標,對於你的觀眾來說,如果他們要把你的文章標籤於自己的書籤裡,如果能夠很清楚的就看到你的圖貼,有很大的加分做用哦!

WordPress不懂程式0-1 自架部落格 | 佈景主題SOLEDAD(基礎設定篇)
自訂>General>Category,Tags,Search,Archive Pages

自訂>General>Category,Tags,Search,Archive Pages

5.分類頁面顯式側邊欄(勾選為顯示) – 建議設定為全局皆顯示,若有其中分頁不想顯示,再各別設定取消即可,不然未來大量的網頁設計時,每一個都要重新設定,會很麻煩哦。

6.刪除頁面上的"類別"字樣(如果不想要出現分類等字樣,可以勾選取消顯示)

7.設定文章顯示的樣式﹙可自行點選,選擇自己喜歡的模版)

不懂程式0-1自架部落格 | 佈景主題SOLEDAD(基礎設定篇)
自訂>General>Typography

自訂>General>Typography

修改文字(建議網站的文字可以做一個統一的設定,對於你的觀眾來說會有一個比較好的視覺效果)

8.標題的文字設定

9.內文的文字設定

10.文字的行高

11.應用在分類頁面的標題,標籤頁面的標題,搜索頁面標題,存檔頁面頁面標題字體大小

12.網站導航的文字大小

13.閱讀更多,網站按鈕的字體大小

自訂>General>color

全站的顏色設定,可依照自己的品牌主題顏色來分別設定


頂端選單設定(TopBar)

WordPress不懂程式0-1 自架部落格 | 佈景主題SOLEDAD(基礎設定篇)
自訂>TopBar

自訂>TopBar

如圖所示,為最上方的頂端欄設定

1.基本顯示方式設定

2.頂端欄的字體設定

3.頂端欄的顏色設定


頁首設定(Logo & Header)

WordPress不懂程式0-1 自架部落格 | 佈景主題SOLEDAD(基礎設定篇)
自訂>Logo & Header>Logo

自訂>Logo & Header>Logo

1. 上傳你製作好的LOGO,設定LOGO最寬尺寸

2.輸入點選圖片後所連結的網址

自訂>Logo & Header>General

3.頁首的顯示模式

4.頁首的寬度設定

自訂>Logo & Header>Slogan Text

5.LOGO圖片下方的文字


垂直選單設定(Vertical Navigation & Hamburger Menu)

這邊如果有需要,可以參考下圖設定

%E5%9E%82%E7%9B%B4%E9%81%B8%E5%96%AE%E8%A8%AD%E5%AE%9A%EF%BC%88Vertical Navigation Hamburger Menu%EF%BC%89
垂直選單設定(Vertical Navigation & Hamburger Menu)
  1. 垂直導航的型式
  2. 漢堡選單的型式

側邊欄設定(Sidebar)

%E5%81%B4%E9%82%8A%E6%AC%84%E8%A8%AD%E5%AE%9A%EF%BC%88Sidebar%EF%BC%89
側邊欄設定(Sidebar)
  1. 側邊欄的設定選項
  2. 側邊欄的字型大小
  3. 側邊欄的顏色

頁尾設定(Footer)

%E9%A0%81%E5%B0%BE%E8%A8%AD%E5%AE%9A%EF%BC%88Fotter%EF%BC%89
頁尾設定(Footer)
  • (1.2.3)WordPress後台>外觀>小工具>Footer Column #1 #2 #3 (這個部份會在下一章節設定教學)
  • 4.顯示社群媒體圖標:自訂>Footer>General>Disable Footer Social Icons(請不要打勾)
  • 5.頁腳版權:自訂>Footer>General>Footer Copyright Text
  • 6.顯示頁腳轉到頂部按鈕:自訂>Footer>General>Disable Go To Top Button on Footer(請不要打勾)
  • 7.顯示頁腳浮動頂部按鈕:自訂>Footer>General>Enable Go To Top Button Floating on The Bottom Right(打勾)

社群媒體設定(Social Media)

將你所有相關的社群媒體連結網址貼上,即可在頁面中顯示有使用的社群媒體圖標。


由於Soledad佈景主題是國外的設計網站,內容皆是由英文設定的,這個選項裡可將所有常用到的文字直接翻成中文,或是你想呈現的文字,減少之後在創作上重覆設定的麻煩。

文字翻譯設定(Quick Text Translation)

Frame 1

結語

基礎設定到這邊,真是辛苦你啦!在架站的過程中,有非常多的小細節要不停的重覆測試,以上都是我有測試過,並且正在使用的選項,提供給你參考。你也可以自己多方測試看看哪一個更適合你哦!

你一定有發現,怎麼頁面和文章的相關設定都沒有呢?因為我發現它實在是太龐大的一個工程了,如果全部集中在這裡讓你一次設定,你應該會覺得頭昏眼花的。我將於下一章節繼續帶著你深入研究頁面和文章的奧妙。


相關文章:

覺得實用嗎?快把文章儲存起來!
創業之路有我陪你一起成長,希望我所有的分享都能夠幫助到你解決問題。
如果你喜歡我的分享,可以點一下愛心,讓我知道我為你創造的內容是有幫助的。
也歡迎你分享這個文章給你的朋友,讓他也可以從迷惘中快速的找到方法。
訂閱我的電子報,讓我能在第一時間把有價值的內容送給你。
歡迎你留言或寫信給我,告訴我你遇到的問題,讓我們一起為疑惑找到出路。

你可能也喜歡