每月僅需 600 元起便能享有快速、安全及穩定的主機空間

Astra WordPress 佈景主題

Astra Theme 介紹,一款快速、易用且具有高度客製化的全方位 WordPress 佈景主題 (完整教學)

/ 閱讀時間 33 分鐘 

最後更新時間 : 2023 年 9 月 22 日

在 WordPress 佈景主題目錄裡有一萬多種的免費佈景主題可以讓你挑選,不過太多的選擇有時候也是一種困擾。

如果你正煩惱到底要使用哪一個佈景主題,我會建議從 Astra Theme 開始,你可以先免費體驗一下再決定要不要付費,端看需求而定。

本篇文章會介紹什麼是 Astra 佈景主題,然後展示其方案與特色,最後則會推薦一些與其相關的外掛。

什麼是 Astra 佈景主題?

Astra WordPress 佈景主題

Astra 是由一間位於印度的軟體公司 Brainstorm Force 所開發的 WordPress 佈景主題,截至目前為止,已有超過 1,600 萬個網站是由其所建置,五星評價也有近 6 千個,由此可知在市場上非常受歡迎。

常用連結如下:

為什麼選擇 Astra 佈景主題?

WordPress 佈景主題數以萬計,那麼為什麼要選擇 Astra?特色如下:

  • 快速輕量:沒有使用 jQuery、只需不到 50 KB 資源即可運作、載入時間只要 0.5 秒、可以關閉沒有使用到的功能。
  • 提供數百種網站範本:180+ 預先設計好的範本隨選即用,可以節省設計所需的時間。
  • 支援多種編輯器:包含 Elementor、Beaver Builder 及內建的區塊編輯器
  • 操作介面直覺:所有調整網站外觀的設定都在外觀自訂器上,你可以即時看到修改後的結果,不需要切換畫面查看,非常便利。
  • SEO 友好:適合行動裝置瀏覽且內建導覽標記及必要的 Schema.org 標記。
  • 支援多國語系:你可以使用 .po 與 .mo 檔案翻譯 Astra 佈景主題或者透過外掛建置多國語系網站。
  • 生態圈豐富:Brainstorm Force 旗下除了 Astra 佈景主題外,還開發許多實用的外掛,包含:Spectra (編輯器)、WP Portfolio (作品集)、Schema Pro (結構化資料)、Convert Pro (名單收集)、Ultimate Addons for Elementor (編輯器)…等等。

Astra 與 Soledad 比較

Astra 佈景主題方案與價格

Astra 佈景主題永久免費,如果你想要獲得更多調整外觀的設計選項與功能,可以購買 Astra Pro 外掛解鎖。目前官方有提供三種方案,如下:

Astra 佈景主題方案與價格

方案一:Astra Pro

方案內容:Astra Pro (固定頁首、自訂版面配置、進階部落格版面配置…等等)

價格:首年 49 USD,第二年起 59 USD (約期授權) / 特價 239 USD,原價 249 USD (終身授權)

方案二:Essential Bundle (推薦購買)

方案內容:Astra Pro、180+ 進階範本、WP Portfolio (作品集)、Elementor 與 Beaver Builder 附加元件任選一個

價格:首年 169 USD,第二年起 276 USD (約期授權) / 特價 499 USD,原價 996 USD (終身授權)

方案三:Growth Bundle

方案內容:Essential Bundle 所有內容、Schema Pro (結構化資料)、Convert Pro (名單收集)、Ultimate Addons for Elementor (編輯器)、Ultimate Addons for Beaver Builder (編輯器)、SkillJet 學院會員資格以及未來所有開發的產品

價格:首年 249 USD,第二年起 523 USD (約期授權) / 特價 699 USD,原價 1893 USD (終身授權)

Astra 佈景主題教學

如何安裝 Astra 佈景主題?

為了要安裝 Astra 佈景主題,你需要在 WordPress 網站管理後台執行以下步驟:

  • 前往 [外觀]→[佈景主題]
  • 點選「安裝佈景主題」
  • 上傳 Astra 子佈景主題 .zip 檔 (你可以透過子主題生成器建立)
  • 啟用 Astra 子佈景主題
補充說明
※不論你是使用哪一種 WordPress 佈景主題,建議都要安裝並啟用子佈景主題。未來如果有在 functions.php 新增功能或在 style.css 新增樣式,更新之後才不會被覆蓋掉。 如果佈景主題沒有提供子佈景主題檔案,你可以透過 Child Theme Configurator 這款外掛建立。

Astra 佈景主題設定總攬

當你啟用 Astra 佈景主題後,相關的設定會出現在兩個地方,分別是 WordPress 網站管理後台左側的 Astra 選單下及網站前台的外觀自訂器上。

網站後台:Astra 選單項目底下
網站後台:Astra 選單項目底下
網站前台:外觀自訂器
網站前台:外觀自訂器

網站後台設定:

  • 管理後台:上方分頁中有歡迎、設定、Starter Templates 及免費版與付費版的比較。
    • 歡迎:包含 Astra 佈景主題的官方影片介紹、快速設定、實用外掛等等。
    • 設定:有別於外觀自訂器上的設定,都是一些偏向系統上的設定,像是於本機載入 Google 字型、版本控制、重新產生檔案等等。
    • Starter Templates:會引導你安裝 Starter Templates 外掛以便快速匯入示範內容,提升網站建置的效率。
    • 免費版與付費版的比較:以表格的方式列舉 Astra 佈景主題與 Astra Pro 外掛間的差異。
  • 自訂:會導向至外觀自訂器,也是 Astra 佈景主題主要設定的位置。
  • 自訂版面配置:你需要購買 Astra Pro 才能使用這項功能。
  • Spectra:一款與 Astra 佈景主題搭配的區塊編輯器擴充外掛。

外觀自訂器設定:

  • 全域
  • 頁首編輯器
  • 導覽標記
  • 網站文章
  • 頁面
  • 資訊欄
  • 頁尾編輯器

網頁版面配置

你可以根據實際需求或個人喜好設計網站的版面配置,使其成為你自己的佈景主題!

在開始說明如何調整外觀之前,你需要先了解一個網頁的架構,主要可以拆解成四個區域 (與 Astra 佈景主題在外觀自訂器的設定順序相同),如下:

  • 頁首區域
  • 內容區域
  • 資訊欄區域
  • 頁尾區域

頁首區域

頁首區域是訪客來到你網站第一眼掃描到的地方,是建立你與訪客的第一印象,最基本的元素有兩個:標誌與選單。

你可以使用 Astra 佈景主題內建的頁首編輯器新增這些元素 (建議),免費版就有這項功能,不需要購買 Astra Pro 擴充。

如何新增網站標誌與圖示?

標誌:

  • 前往 [自訂]→[頁首編輯器]→[標誌]
  • 點選「選取標誌」

※標誌的檔案的格式建議使用 SVG,好處是不會因為解析度的大小造成圖片失真以及檔案較小。需要特別注意的是,WordPress 由於安全性因素並不支援 SVG,需要另外安裝 Safe SVG 外掛才能解決此問題。

網站圖示:

  • 前往 [自訂]→[頁首編輯器]→[網站圖示]
  • 點選「選取網站圖示」以上傳你的網站圖示

※網站圖示的尺寸建議 512×512 像素,檔案格式為 PNG 檔。

如果初期預算有限,市面上其實有很多製作網站標誌與圖示的工具,像是 DesignEvoCanvaLogaster …等等。當然,你也可以請設計師替你規劃,如果有需要可以與我們聯絡

如何建立選單?

上述所提到的頁首元素只是最基本的,視需求還可以新增按鈕、搜尋、社群圖示…等等,更多的組合變化我會放在付費課程進行說明。

內容區域

內容區域是一個網頁最重要的地方,訪客可以藉由這個區域知道該頁面主要表達的內容是什麼。

內容區域主要可以分成文章與頁面,兩者之間的差異如下:

文章頁面
時間順序沒有
更新頻率經常更新較少更新
組織方式分類與標籤上下階層

當然,現有的文章或頁面可能無法滿足你的需求,這時候就需要建立自訂內容類型。不過這是比較進階的操作技巧,我會放在付費課程中說明。

內容堆疊與編輯器架構

不論你是使用什麼編輯器,操作的邏輯都是採用「區塊堆疊 」的方式,由上到下一層一層地新增內容。

編輯器的架構是由區塊、欄位與元素所組成。每一個區塊可以新增不同數量的欄位,每一個欄位可以新增不同數量的元素。

※編輯內容的方式我偏好「文章 」使用區塊編輯器,「頁面 」使用 Elementor 編輯器。方式沒有絕對,效能與便利間的取捨。

一個部落格重要的兩個頁面

  • 關於:讓讀者了解你是誰、提供什麼產品與服務、願景與理念、成就與獲獎紀錄、著作、專訪、見證、歷程…等等
  • 聯絡讓對你有興趣的潛在客戶可以進一步與你聯繫,可能是合作、邀約、詢問產品或服務…等等

當然,可能還會有服務、作品集、常見問題…等頁面,端看需求而定。如果你需要請人設計網頁,可以參考我們的驅動型網站設計服務。

如何新增文章清單?

Astra 佈景主題本身就有提供相關的設定,若你覺得免費版沒有符合需求,那麼可以購買 Astra Pro 解鎖更多功能或者參考以下文章。

資訊欄區域

資訊欄區域通常會放置網站的一些額外資訊,像是熱門文章、廣告、社群追蹤…等等。一般來說,會出現在單篇文章與文章彙整頁上。

頁尾區域

頁尾區域主要用於承載因為空間有限而無法放置在頁首區域的元素,像是關於我 (們)、聯絡資訊、快速連結…等等。

你可以使用 Astra 佈景主題內建的頁尾編輯器新增這些元素,免費版就有這項功能,不需要購買 Astra Pro 擴充。

如何設定頁尾小工具?

  • 前往 [自訂]→[頁尾編輯器]
  • 你可以在任一區塊新增小工具,Astra 佈景主題所提供的小工具有:社群、HTML、頁尾選單、小工具

如何設定版權聲明?

最簡單方式為直接輸入文字,不過每年都需要重新調整,非常沒有效率。比較聰明的做法是,利用 Astra 佈景主題內建的短代碼來達成。

  • 前往 [自訂]→[頁尾編輯器]
  • 輸入 Copyright © [current_year] [site_title]

※ [current_year] 是目前年份,[site_title] 則是網站標題

如何新增返回頂端按鈕?

返回頂端是 Astra 佈景主題免費的功能,用途是讓網站訪客快速回到網頁的頂端,無需向上捲動。做法如下:

  • 點選外觀自訂器後,前往 [全域]→[返回頂端]
  • 啟用返回頂端後,你可以調整圖示尺寸、色彩及框線圓角半徑等設定。

Astra 佈景主題常見的免費功能

雖說 Astra 佈景主題有提供付費版,不過免費版仍有許多常見的功能,像是相關文章導覽標記三欄式頁首頁尾編輯器返回頂端按鈕行動裝置選單標籤等等。對於部落格類型的網站來說,還算夠用,不足的部分可以透過外掛加強。

更多關於 Astra 佈景主題的免費版與付費版間的差異,可以參考官方的比較表格,有詳盡的說明。

與 Astra 佈景主題相關的外掛總整理

以下整理許多與 Astra 佈景主題相關的外掛,你可以視實際需求決定要不要安裝,全部都是免費的,部分有提供更進階的付費方案。

外掛名稱:Starter Templates

費用:基本免費,進階付費

解決問題:如果你不想要從零開始設計網頁,那麼可以使用 Starter Templates 直接匯入範本再更改內容

外掛名稱:Astra Theme Visual Hooks

費用:完全免費

解決問題:以視覺化的方式呈現 Astra 佈景主題所有勾點的位置

外掛名稱:Astra Widgets

費用:完全免費

解決問題:提供地址、圖示清單及社群檔案 3 種內建區塊編輯器沒有的區塊

外掛名稱:Spectra

費用:完全免費

解決問題:加強內建區塊編輯器的不足

外掛名稱:Astra Bulk Edit

費用:完全免費

解決問題:逐一編輯 Astra 中繼資料的設定非常沒有效率,藉由批次編輯的功能可以節省許多時間

外掛名稱:Astra Customizer Reset

費用:完全免費

解決問題:將 Astra 佈景主題外觀自訂器的設定恢復成初始狀態

外掛名稱:Import / Export Customizer Settings

費用:完全免費

解決問題:在不同的網站上轉移 Astra 佈景主題外觀自訂器的設定

外掛名稱:Customizer Search

費用:完全免費

解決問題:在 Astra 佈景主題外觀自訂器新增搜尋的功能,以節省尋找設計選項與功能的時間

常見問題

列舉一些關於 Astra 佈景主題常見的問題。

結論

毫無疑問 Astra Theme 絕對稱得上是最好的 WordPress 佈景主題,主要的理由是:效能好、上手容易及具有高度客製化等特性,不論你是初學者還是有經驗的專家,都很適合。如果你還沒有使用過 Astra,可以來嘗試一下。

這篇文章對您是否有幫助?

0 / 5

Your page rank:

不滿意現有網站的速度嗎?😥

我們提供的 WordPress 網站代管服務能讓你的網站快如閃電,進而提升使用者體驗與 SEO 排名。

全方位學 WordPress – 從架站到整合行銷 2.0

這是一門 WordPress 架站與 SEO 行銷課程,學完後便能擁有更全面的架站技能並且透過課程所教的行銷操作手法與資源,讓你的網站獲得更多曝光的機會,進而帶來收益。

發佈留言

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


購物車

聯絡我們

請填寫以下表單,我們將盡速與您聯繫

聯絡資訊
需求確認


驅動

關於我們

驅動數位行銷成立於 2019 年,提供個人或企業在網路上的各種行銷解決方案,主要的服務項目包含:網頁設計、網站代管以及搜尋引擎最佳化。與其他網頁設計公司不同之處在於,我們是以獲得更多流量、名單、銷售與轉介紹為導向。

PRO 360 專家檔案