Astra主題教學 - 新手入門必知的1款WordPress佈景主題

Astra主題教學 – 新手入門必知的1款WordPress佈景主題

文章最後更新日期 2021 年 3 月 9 日

站長接案多年以來,使用過這麼多WordPress佈景主題,最後還是覺得 Astra主題最好用,也最容易上手,也是最推薦的1款主題

Astra主題 是2017年推出,是一款輕量且兼具網站速度及可高度客製的 WordPress多功能佈景主題,由 Brainstorm Force這家公司所建立,這個佈景主題一開始沒有安裝太多功能,加上採用Vanilla JavaScript,禁用 jQuery 減少載入請求,比起其他 WordPress主題至少需要300kb以上,Astra僅需要50kb的資源就能運作。

Astra佈景主題適用於 作品集網站部落格網站形象網站購物車網站,也有提供一鍵式匯入範例的功能(需要先啟用 Astra Starter Sites外掛)

想瞭解更多不同的佈景主題介紹,可以參考站長的這篇懶人包文章

在費用方面,Astra主題 分為年費方案終生方案,若是想承接網頁設計案件的朋友,建議可以購買 Mini Agency Bundle 終身方案

除了附有官方附的範例版型之外,還有附加 WP PortfolioUltimate Addons for Elementor  ,這兩個外掛都非常好用

Astra主題官網

一、輕量級WordPress佈景主題-Astra

Astra主題官網
Astra主題官網

Astra價格方案(以下價格為USD美金)

  1. Astra Pro $41 /年 、 $249 終身 (單一網站推薦)
  2. Mini Agency Bundle $169/年 、 $499 終身
  3. Agency Bundle $249/年 、 $699 終身(包含主題、SEO、頁面編輯器、行銷工具、所有版型,接案者必備)

Astra佈景主題免費版本已在20萬多個網站上使用,還是一款可以使用於 AMP 的 WordPress主題,可以加速使用者在行動裝置(如手機、平板電腦)開啟網站的速度

Astra主題沒有加上太多的資源,所有的程式都是為速度而精簡優化。為了提升網站速度,Astra 使用了更加輕量的 Vanilla JavaScript,不使用jQuery就可以實現大部分功能,一開始主題載入的資源非常少,所以能夠在很短的時間內完成網站載入

這款主題免費版的選項設定比較少,需要對 WordPress架構有基本認識會比較好上手,若是需要更多客製化功能的話,建議可以購買 Astra Pro方案來升級,後續建置網站上會輕鬆許多。

由官方的數據來看,Astra主題在效能上的分數都很不錯,輕量的網站不僅瀏覽速度快,也會增加SEO分數

Astra主題教學 - 新手入門必知的1款WordPress佈景主題

Astra這家公司所開發的其他 WordPress外掛也很實用,例如……

延伸閱讀  WordPress外掛 – Astra Hooks 任意位置增加固定程式或內容

二、Astra主題提供70多款以上的精美的網站範例

Astra主題教學 - 新手入門必知的1款WordPress佈景主題 Astra主題 也提供了多達70款以上的精美網站版型(免費版約為35款),視覺設計的質感都很不錯,適用於 作品集網站部落格網站形象網站購物車網站,這些網站範例都可以透過 Astra starter sites 外掛來快速匯入,搭配 Elementor 或 Beaver Builder 頁面編輯器外掛,不僅網站修改方便,也能輕鬆建立出各種出色的版型。

三、Astra主題的功能特色

除了視覺設計、網站速度和客製彈性外,Astra佈景主題還有幾個特點推薦使用

  1. 無障礙標章WCAG支援到2.0 AA級
  2. 適合開發人員使用的 HOOK掛鉤和篩選器
  3. 主題採用 SEO 結構化標記開發
  4. 支援多國語言網站建置
  5. 在 Github 開放原始碼,任何人都可加入開發修改
  6.  Astra 可使用常見的頁面編輯器,如 Elementor、Beaver Builder

Astra主題教學 - 新手入門必知的1款WordPress佈景主題

延伸閱讀:OceanWP主題 – 快速輕巧且客製化彈性高多功能主題

四、Astra Pro 付費版功能介紹

因為 Astra主題是以輕量快速為訴求,有需要的網站功能再增加網站的程式比較乾淨,若是需要高度客製化及發揮 Astra的好用之處,還是建議購買 Astra Pro方案,才能發揮這個佈景強大實力。

升級到Pro方案的功能增加這些功能……

  • 設定商品頁版面
  • 設定網站的版面
  • 設定部落格的版面
  • 增加商品的快速查看
  • 更多的顏色設定
  • 更多Header樣式設定
  • 可設定商品圖片圖庫選項
  • 商品增加無限滾動選項

前往Astra主題官網

如果想知道 Astra 免費版 與 付費版的功能差異,可以參考Astra官方這兩篇的比較與說明

https://wpastra.com/features/
https://wpastra.com/astra-free-vs-pro/

Astra主題教學 - 新手入門必知的1款WordPress佈景主題

五、Astra主題支援的頁面編輯器

Astra主題 主流支援 ElementorBeaver builder 頁面編輯器,其網站版型也常使用這兩款來做設計,站長也較為建議使用這兩款頁面編輯器,除了方便使用之外,設計的 RWD頁面也比較少發生跑版的問題。

Astra佈景主題還支援 Woocommerce購物車、LearnDash課程系統、Toolset(客製化欄位)

Astra主題教學 - 新手入門必知的1款WordPress佈景主題

六、Ultimate addons for Elementor – Elementor 擴充外掛

Ultimate addons for Elementor 這是一款由官方開發的 Elementor 擴充外掛,提供更多元的 Elementor 元件及網站模板可以使用,不僅可以提升網站質感,還可以客製更專業的網站

官方有提供 Elementor 元件的預覽,可以到這裡玩玩看 https://uaelementor.com/

Astra主題教學 - 新手入門必知的1款WordPress佈景主題 Astra主題教學 - 新手入門必知的1款WordPress佈景主題 Astra主題教學 - 新手入門必知的1款WordPress佈景主題

七、Astra主題安裝教學

如果你還不知道如何安裝 Astra佈景主題的話,可以照著站長的步驟來操作,就可以快速把這款好用的主題裝起來囉

1、首先進到 WordPress網站後台,點選「外觀」,再搜尋關鍵字「Astra」,找到佈景主題之後按下「安裝」

Astra主題教學 - 新手入門必知的1款WordPress佈景主題

2、安裝完之後會出現 Astra主題的提示文字,接著按下「Get Started」開始設定

Astra主題教學 - 新手入門必知的1款WordPress佈景主題

3、再來會出現 「頁面編輯器」的選擇畫面,選擇您常使用的頁面編輯器外掛,這裡選擇 Elementor做示範

Astra主題教學 - 新手入門必知的1款WordPress佈景主題

4、再來進入 Astra主題的網站版型,可以挑選喜歡的網站風格
若網站上有 「AGENCY」的標籤,則表示這個範例是需要購買 Pro方案才可以使用
這裡站長選擇 「Mountain」 這個作為範例

Astra主題教學 - 新手入門必知的1款WordPress佈景主題

5、選定版型之後,會進入到版型的預覽圖片,這裡會出現版型的頁面提供確認,沒問題的話就點選下方按鈕「Import Complete site」開始匯入

Astra主題教學 - 新手入門必知的1款WordPress佈景主題

6、若是先前已有安裝過其他外掛,Astra也會檢測出現提示訊息,這裡按下 「skip & import」開始匯入

Astra主題教學 - 新手入門必知的1款WordPress佈景主題

7、接著會出現要「匯入資料」的選項,這裡都可以依需求任意選擇,由上而下的選項說明分別為
7-1、Delete  Previously imported site =>刪除先前網站的資料(文章及頁面)
7-2、Import customizer setting =>匯入設定
7-3、Import Elementor Style Kit =>匯入Elementor 風格工具
7-4、Import Widgets =>匯入小工具
7-5、Import Content =>匯入範例資料

Astra主題教學 - 新手入門必知的1款WordPress佈景主題

8、恭喜,看到這個畫面,表示網站已匯入成功,可以點選 「View Site」開始觀看網站

Astra主題教學 - 新手入門必知的1款WordPress佈景主題

9、回到 WordPress網站後台,點選「外觀」→「Astra options」查看主題的工具及設定,這裡會有主題的基本設定,還有免費版與付費版的功能列表
在這個步驟, 有購買 Astra Pro 的方案,可以修改的項目比較完整,若要發揮Astra主題的好用之處,建議購買pro方案,修改彈性比較大

Astra主題教學 - 新手入門必知的1款WordPress佈景主題

Astra 付費版的功能設定

Astra主題教學 - 新手入門必知的1款WordPress佈景主題

免費版的外掛啟用設定

Astra主題教學 - 新手入門必知的1款WordPress佈景主題

10、也可以點選「外觀」→設定,進入到 Astra主題的外觀設定

Astra主題教學 - 新手入門必知的1款WordPress佈景主題

八、結論

Astra佈景主題免費版的功能設定比較少,也容易上手,再視網站需求及定位增加想要的功能即可,達到網站輕量化,也能提升網站速度
站長覺得這款主題很適合想進入網頁設計領域,使用WordPress架站的朋友,因為客製化彈性很夠,所以只要摸熟這個Astra主題,就可以應付大多數的網站案件需求。


若是對於教學文章有不清楚的地方,歡迎在下方留言

如果覺得我們的文章對你有幫助,也歡迎幫我們「分享」文章給更多人

我們正在製作 WP新手架站課程,包含部落格經營、電商網站的建置及經營教學,讓你省下5-10萬元的網站費用,不論是自己要經營,或是要當作接案技能都很適合,有興趣的話可以先填寫Email加入,我們將優先通知您,也能享有早鳥優惠價唷~~

想要快速學習成長架站的話,可以參考 WordPress專人1對1網站教學服務 ,1對1的教學可以針對您的需求,讓你更快速學習學習架站技能

若是有網頁設計的需求,也可以透過「聯絡表單」或是「線上客服」的方式與我們聯繫
我們也有提供一對一教學及顧問服務,有需求的話也都可以跟我們聯絡唷

如果對 WordPress架站 有興趣的朋友,可以訂閱馬思特電子報或是按讚追蹤馬思特粉絲頁,我們將不定時發佈 WordPress網站 及 網頁設計相關文章。

近期開了一個FB社團,「WordPres網站架設 / 網頁設計接案 / 部落格經營 / 網路行銷 / 網路賺錢 」,主要會是討論網站架設、部落格經營、網路行銷,進而探討如何從網路賺到錢,有興趣的朋友歡迎加入社團交流

如果我們的教學文章有對您有幫助,可以在下方按5下拍手,或是請 站長喝杯咖啡 支持我們創作更多優質的文章

更多實用文章推薦

Leave a Comment

發佈留言必須填寫的電子郵件地址不會公開。 必填欄位標示為 *

Scroll to Top