內容目錄
歡迎回到鵠學苑 — WordPress網頁設計超詳細攻略 – AVADA ｜WordPress主題教學，在之前的文章 WordPress主題選用 中有提到跟付費主題有關的介紹，也有提到在 envatomarket 這個網站可以挑選適合自己網站風格的佈景主題去購買，而今天的教學文章，就是要跟大家粗淺的介紹一下AVADA這個在 envatomarket 中排名一直在前三名，在2018年超過40萬購買下載的實用WordPress佈景主題。
為何要使用AVADA做為網站的佈景主題，理由是什麼呢？主要有AVADA支持 RWD ( RESPONSIVE WEB DESIGN ，響應式網站設計)，可以在建構網站的頁面時對內部各種元素分別設定在不同大小的瀏覽設備上呈現怎樣的效果，帶給使用者更好的網站體驗;使用與以往跟 WordPress 內建編輯器設定網站的做法不同，AVADA擁有一套名為Fusion Builder的網頁建構器，以拖拉的方式做網頁排版，讓網站架設的初心者也能快速上手;另外我個人覺得功能中最有幫助的，就是AVADA具有完整的 ” 售後服務 “，無論發信、留言詢問，教學論壇、學習操作影片等等的功能相當完備，不會讓新手感到不知所措。而今天我主要就先跟大家介紹AVADA在envatomarket市集中的一些特點，以及如何應用Demo快速架站，接下來跟著鵠學院的腳步，讓我們開始學習吧！
(小提醒：鵠學苑的所有教學均是以Apple Mac OS X系統 做步驟示範！)
AVADA佈景主題下載
https://themeforest.net/item/avada-responsive-multipurpose-theme/2833226?s_rank=1
第一步：進入到 envatomar 的首頁，輸入AVADA以搜尋主題，在搜尋結果中點選進入主題介紹以及購買的頁面。
第二步：AVADA的購買價位是美金60元，換算台幣不到兩千塊，就其功能性而言，這樣的價位並不算貴，另外在圖中有紅色方框標示美金18元的欄位，如果點選加購的話，網站諮詢服務可以由半年延長至一年，也就是說有任何網站上操作的問題，都可以與他們的客服技術人員聯絡，相當超值。
第三步：在選購佈景主題時，看看文字或圖片介紹始終不太真實，畢竟站長們都一定希望好的佈景主題可以兼具美觀、功能、便利三大要點，AVADA基於這個想法，也提供了範例網站給使用者參考，如下圖點選 Live Preview 的按鈕，就可以看到範例網站的預覽。
第四步：在預覽的頁面上方有各種類型的網站元素，從首頁、關於我們、圖片輪播、部落格、商店一直到頁尾的聯絡資訊等等，可以說是相當完整。
第五步：點開範例網站頁面右邊的設定圖案，會有可以選擇當前佈局的選項，可以選擇全寬或盒形，搭配範例網頁元素呈現在畫面上的樣式，讓使用者對於AVADA所提供的範例網站樣式可以有更多的認識。
第六步：下圖就是選擇盒形佈局，可以看到網頁中的內容會被限制在固定的寬度，而在佈局選擇的下方也提供了背景圖片，可以自行點按看看套用後的效果，另外盒型佈局也可以做成具有視差設計的樣式。
第七步：AVADA提供了相當多的範例網站可以預覽，如果對於當前的範例網站不滿意，可以在下圖中點選網站縮圖，就會跳轉到這個範例網站，這讓使用者可以挑到自己喜愛的佈景主題，再決定是否要購買。
第八步：在AVADA主題介紹的頁面中，也有特別講到安裝主題時就會 “附贈”下圖中的 WordPress 外掛程式，這些外掛主要是可以在網頁中設定各種效果，比如說大圖輪播、標籤雲、視差滾動、時間軸等等。至於為什麼說是”附贈”，因為這些外掛都不用再另外付費購買，而且重點在於AVADA已經幫我們將佈景主題跟這些外掛做了完美的結合，所以比起購買佈景主題又另外自行去尋找外掛安裝來說，網站出現錯誤的狀況相對而言比較低，這其實就省去了架站中不少的麻煩。
第九步：在裡介紹的是AVADA獨家的網頁建構器，讓架站的人可以輕鬆的完成網頁排版，而不需要使用太多的程式碼。
第十步：在AVADA網站設定的部分也相當完整，在這裡可以對所有網站中必備的元素做設定，諸如選單、顏色、背景、作品集、部落格或商品頁的樣式、社交媒體選項、甚至是 GOOGLE MAP 或網站管理工具的代碼等等，都可以做詳細的設定。可以說將這裡面的所有選項數值調整到適當位置，網站幾乎就已經完成30%了，剩下的就是細節調整以及圖片及文字的內容變更。
第一步：安裝完主題在 WordPress 上後，可以在側邊工具欄上AVADA選項的FAQ（如何安裝佈景主題可以參考鵠學苑的教學文章 WordPress主題選用），可以找到我要如AVADA得到幫助的選項，如下圖所示可以找到幫助頁面的連結AVADA Theme Support。
第二步：可以在幫助頁面直接輸入問題搜尋，可以找到發表在官方論壇或其他使用者所問的相關結果。
第四步：在外觀中可以啟用AVADA的佈景主題，也具有預覽跟自訂主題的功能，如果不熟操作，可以參考鵠學苑之前的教學文章 WordPress 教學介紹五（外觀）。
第五步：接著講解如何匯入剛剛在AVADA介紹頁面中預覽的範例網站。一樣選AVADA的選項，在清單中點擊Demo。
第六步：如圖所示可以看到如剛剛預覽畫面中所有的範例網站。
第七步：點選想要套用的網站版型，可以選擇直接匯入版型，或者再次預覽網站範例查看套用後的效果。
第八步：在下圖紅色方框中，標示1的位置是這個版型所需要安裝的外掛，如果沒有全部變成藍色的 Active，是沒有辦法匯入版型，這是因為在AVADA的網站版型中每一個都具有網站自帶功能性，如果不安裝外掛，這些功能就無法被啟用，因此會強制使用者一定要先安裝好外掛，才不會導致版型匯入發生問題。而在標示2的位置是這個版型中各種網站部件，網站示範版型可以說已經是完成的網站，因此為了要標示欄位所必須放置的媒體或文字，在匯入版型後會有一些範例文章、圖片、文字等，如果說對於網站架設已經有相當的熟悉度，在這裡可以自行選擇是否要匯入版型內所有的示範元素。
第九步：在啟用所有的外掛後，將要匯入的內容全部勾選，按下IMPORT的按鈕，即可匯入版型。
第十一步：這裏跳出的提示是再次確認要匯入所有版型的元素，附帶一提的是，如果網站不是剛安裝完WordPress的狀況，而是已經套用其他版型或已經使用過WordPress其他主題，請將舊有的資料先刪除後再匯入版型，否則很可能導致網站的排版亂掉或功能出問題。按下OK的按鈕，接著就等待匯入完成。
第十二步：回到網頁前台就能看到版型已經安裝成功了。
AVADA這套佈景主題其實功能相當的豐富，無論是單頁式網站、形象網站、電子商務網站，都有適合的版型可以套用，為什麼在本篇文章中會強調可以套用版型這件事呢？相信對於不管是想在網路上開設電商網站，或者是想要寫文章或拍攝相片影片分享在網路上的人來說，網站的調整跟架設都是一件相當麻煩的事情，網頁佈局長得差強人意那倒還好，但如果是網站的功能失效或者無法建立更直覺的瀏覽方式，那再好的作品或商品都無法吸引到廣大的網民們青睞。因此使用付費的佈景主題匯入網站範例就是很方便的一件事情，照著範本去建立站內功能，依循建構好的版型更改文字跟圖片，不能說一百分但至少也會是個不錯的網站。今天的教學到這裡告一段落了，後續還會再推出其他主題的教學，所以不要忘記持續關注鵠學苑的最新文章，想學習超詳細的WordPress攻略嗎？？來 鵠學院 就對了！我們下次的教學見～
一頁式網站介紹 – 單頁式活動網站製作要點與應用說明
微軟公布 : 2021 年 Microsoft 365 服務將不再支持 Internet Explorer 11（IE 11）
Google 優先索引行動版內容 將於一年內對所有網站實施