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

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

文章最後更新日期 2021 年 6 月 10 日

站長接案多年以來,使用過這麼多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主題,就可以應付大多數的網站案件需求。


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

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

歡迎加入社團:「WordPres網站架設 / 網頁設計接案 / 部落格經營 / 網路行銷 /個人品牌」,主題是討論網站架設、部落格經營、網路行銷,有興趣的朋友也歡迎加入社團一同交流

本網站部份推薦的連結與商家有合作關係,如果您透過推薦連結購買商品,我們會得到少量分潤,支持我們產出更多優質文章,不會影響購買價格,詳情說明請查看 免責聲明

更多實用文章推薦

馬思特

12年以上網站架設與網路行銷的經驗,自由工作者5年+,架過的網站已達百個,製作過形象網站、購物網站、會員網站、課程平台網站,擅用網站工具來解決不同的問題,希望將多年來的網站經營經驗技巧分享給你,若是想成為自由接案者也歡迎私訊交流唷

發佈留言