Free WordPress Themes Himalayas – 佈景主題安裝與設定

Free WordPress Themes Himalayas

在 WordPress Themes – 佈景主題安裝與推薦這篇文章跟大家分享了幾個關於一頁式佈景主題的特色，max 個人非常喜歡這一類式樣設計的佈景主題，簡潔大方的編排方式，平滑順暢的捲動方式，多種行動裝置支援，網站功能介紹集中在首頁，可以讓訪客感受專業的網站設計，最重要的是操作容易，這對於初接觸 WordPress 的朋友來說真的是最好的一個禮物了。接著就以  Free WordPress Themes Himalayas 這個免費佈景主題來做範例，一步一步的設定介紹，讓大家可以清楚看到一個網站的建置過程，由簡單到專業設計呈現，其實並沒有想像中的那麼困難。

安裝 Himalayas 佈景主題

在控制台的外觀/佈景主題/新增佈景主題，請輸入 Himalayas（圖一），安裝完成後請啟用佈景主題。在開始建置網頁前，也請記得先切換使用子佈景主題。這樣子在往後的維護與升級上比較容易管理，也可以避免因為修改設計失誤時造成網站無法開啟的錯誤。

 

Himalayas 佈景主題區塊說明

Himalayas 的DEMO網頁，可以在 http://demo.themegrill.com/himalayas/ 看到完整展示，這類型一頁式網頁的設計，可以看到相關的功能都建置在同一個頁面上，透過上方的功能選單，直接捲動到功能區塊，很適合內容不常更新的網站使用。接著就跟大家說明一下整個網站功能架構（圖二）（圖三）（圖四）。

 

 

 

• 區塊1 上方選單，將網站想要呈現的功能介紹都集中在這裡，訪客透過選單可以不需要跨頁就可以找到需要的資訊。
• 區塊2 Slider，這是一個動態展示區塊，也可以稱做特色文章展示，展示內容儘量選擇可以提升訪客興趣的頁面。規劃給 Slider 使用的頁面也要預先建置好（＊1），Himalayas 佈景主題 支援4篇 Slider頁面。
• 區塊3 About Us，關於自己網站的描述內容，因此需要建置關於網站（About Us）的頁面（＊2）。
• 區塊4 Call to Action，這一個區塊可以解釋作希望訪客採取行動的表現區塊，例如希望訪客參加註冊，消費購買這一類的行為。區塊8 跟這裡的定義是相同的，差別在於 Call to Action 文字與按鈕編排位置不同。
• 區塊5 Our Service，這個區塊顯示的是網站要提供的服務內容，抓取的資料是頁面內容，服務內容的頁面需要先行建置好（＊3）。預設是6篇服務頁面，當然篇數是可以調整自行設定的，原則上依據版面的編排美觀，建議是3的倍數。
• 區塊6 PORTFOLIO，這個區塊可以做為作品展示區塊，可以提供業績案例之類的資料，抓取的一樣是頁面的內容，所以PORTFOLIO頁面內容也請先建置好（＊4）。預設的PORTFOLIO頁面內容是8篇頁面，當然也是可以自行調整，同樣的因應版面美觀所需，建議是4的倍數。
• 區塊7 Blog，部落格區塊，可以來顯示網站的最新內容或是新訊息，預設顯示的是3篇文章，一樣可以自行調整篇數與選擇顯示文章的分類（＊5）。
• 區塊9 Our Team，我的團隊內容來自頁面，因此想要呈現的團隊成員頁面內容需要先行建置好（＊6）。預設顯示3位成員，一樣的是可以自行調整數量的。
• 區塊10 Contact Us，聯絡我們頁面需要事先建置，採用的是 Contact Form 7 外掛程式建置的聯絡頁面內容與簡碼（＊7）。
• 區塊11 Footer Sidebar，這裡是下方小工具區塊，共有左中右三個區塊。可以放置想要加強的資訊區塊，例如文字區塊可以顯示公司聯絡地址電話等等。
• 區塊12 Footer Layout，頁尾佈局顯示的是網站版權宣告，社群網站連結之類的資訊。

 

開始建置網站

前一段的說明如果清楚也依序建置好相關頁面後，接下來的建置就可以事半功倍了。另外需要注意的是每一篇需要的頁面，都需要記得新增特色圖片（圖五），這樣子首頁的呈現效果才會有圖片顯示。區塊1 上方選單，我們移到後面在述，先從區塊2開始。
 

 
區塊2 Slider Setting，在控制台/外觀/自訂/Himalayas Slider Options/Slider Settings， Enable the slider 請勾選，啟用 Slider 展示功能。Slider1/Slider2/Slider3/Slider4 請分別勾選已經建置好的 Slider 頁面（＊1）（圖六）。

 
區塊3 About Us，在控制台/外觀/自訂/小工具/Front Page Sidebar，新增小工具（圖七），加入TG: About Widget（圖八），About Us 區塊設定資料（圖九）。

1. About Section ID: 請填入字串或是文字，也請將這組文字記下來，在建置上方選單時會用到。
2. Title: 請填寫標題，例如關於網站或是 About Us。
3. Description: 簡單描述這個區塊的說明。
4. Page: 請選擇事先建置好的關於頁面（About Us）（＊2）。
5. Button Text: 按鈕文字，這裡建立按鈕的目的是可以增加連結的功能，可以是情況建置或是留空白。
6. Button Redirect Link: 這一欄填入的是上方按鈕所需要的連結網址，如果有建置按鈕才需要填入連結。
7. Button Icon Class: 可以顯示 Font Awesome 圖形，測試效果不顯著，所以跳過留白，不會影響頁面展示效果。

 

 

 

 
區塊4 Call to Action，繼續新增小工具，TG: Call To Action Widget（圖十）。TG: Call To Action Widget 設定（圖十一）。

1. Background Color：這裡可以選擇區塊背景顏色。
2. Image：想要使用背景圖片的話，可以在這裡選擇。
3. Call to Action Main Text：區塊的主要描述文字，也可以視為標題文字。
4. Call to Action Additional Text ：區塊的附加描述文字內容。
5. Button Text：區塊按鈕顯示文字，例如：立刻參加或是立即訂購…可以自行參考網站需求設定。
6. Button Redirect Link ：按鈕連結網址。
7. Choose the layout ：這裡有兩種版型可以選擇，呈現的效果就是區塊4與區塊8。