Astra主題教學指南-Header / Footer Builder設定

本文重點摘要

頁面切換按鈕Toggle Button – Header Builder

切換按鈕是在頁面Header中顯示選單Menu、按鈕、搜尋等內容的一種吸睛的網站設計方式。
它是專門為頁面屏幕設計的,其工作原理類似於手機漢堡包按鈕mobile hamburger button。

當使用者點擊切換按鈕時,它將在屏幕上顯示一個視窗外的窗口,其中包含你新增的所有內容。

由於它在Header中需要的空間很小,因此是在Header中顯示內容的好方法。

這個Header Builder元件是Astra的一項進階功能,可用於Astra Pro 3.3版。
在此版本之前,你需要使用自訂代碼才能在頁面上啟用切換按鈕。改版後直接內建在主題了!

現在,你可以輕鬆地在頁面上顯示視窗以外的內容,並使用新的切換按鈕元件完全對其進行自訂。

如何為頁面新增切換按鈕 Toggle Button

由於這是一項進階功能,因此請確保已更新並啟用了Astra Pro外掛。

請按照以下步驟操作:

步驟1打開Header Builder,然後點擊要新增切換按鈕的部分。
從元件列表中,選擇 Toggle Button切換按鈕 。

步驟2現在你可以選擇內容,即要顯示在使用者點擊切換按鈕時出現的窗口內的元件。

新增切換按鈕後,你將在Header Builder中觀察off-canvas部分。

點擊 off-canvas 部分,將打開一個元件列表。
從此列表中選擇所需的元件,它們將被自動新增到 off-canvas 部分。

你可以新增各種元件,
例如:button按鈕、search搜尋、widget小工具、HTML、social社群、off-canvas menu等等。
要自訂這些元件,只需點擊它們,所有自訂選項將在自訂程式中打開。

小提醒:要在 off-canvas 部分中新增選單,請使用列表中的 off-canvas選單元件。
主選單 和 次選單 Primary 和 Secondary Menu在 off-canvas 部分中將不起作用。

預設情況下,off-canvas預設選單將顯示網站上的所有頁面,就像預設的WordPress選單一樣。
你將需要創建一個專用的off-canvas選單或將任何現有選單分配為off-canvas選單。

如果你不確定如何創建/分配off-canvas外選單

請按以下步驟操作

  • 點擊 off-canvas 選單
  • 在控制台中,點擊 從此處配置選單
  • 在 Off-Canvas Menu 下拉選單中,選擇所需的選單。
    如果所需選單不在列表中,你甚至可以 創建新選單 並將其分配為off-canvas。

步驟3將所有必需的內容新增到 off-canvas 部分後,你可以根據需要設計切換按鈕。

要自訂切換按鈕,請點擊Header Builder中的按鈕,所有網頁設計選項將在自訂程式中打開。

你可以設定

  • Icons – 從三種不同的網頁設計中選擇
  • Toggle Button Style – 從三種預先建構的按鈕樣式中進行選擇
  • Menu Label – 你可以在此處為選單按鈕新增標籤。

點擊 Design 選項卡上的按鈕、設定、大小、顏色、間距。

步驟4你可以自訂off-canvas窗口並為其設定排版和顏色。
為此,請點擊 off-canvas 的齒輪圖標,然後選項將在後台中打開。

在 General 選項卡下,你可以設定類型和位置對齊,而在 Design 選項卡下,你可以設定顏色和間距。

小提醒:如果在自訂中切換到平板電腦或手機設備tablet or mobile devices,可以看到 off-canvas部分。

注意:在桌上型電腦,平板電腦和手機設備上,
帶有Toggle Button的 off-canvas 部分是分開作業的。

這使你可以在不同的設備上設計不同的Toggle Button切換按鈕。
不在平板電腦或手機設備上自動繼承頁面上的off-canvas,反之亦然。


在WPML中使用語言切換器元件Language Switcher

Astra Pro 在Header/Footer Builder中引入了一個新元件 – Language Switcher多國語言切換器。

它允許你在頁首或頁尾中新增多國語言網站,透過網路行銷不同國家。
在文章中,我們將了解它如何與WPML和其他翻譯外掛一起使用。

以下步驟說明如何在頁首中新增和配置Language Switcher元件。
你可以按照類似的步驟將其新增到頁尾中。

步驟1 –在自訂中,到Header Builder。
點擊你要在其中新增不同語言導航的部分。
在元件框中,點擊 Language Switcher元件。

步驟2–打開語言切換器設定時,你會看到兩個選項:

  1. WPML
  2. Custom

僅當你的網站上有WPML處於啟用狀態時,你才會看到此選項。
語言切換器對WPML外掛具有內建支持。
它將自動從WPML中獲取可用語言並將其顯示。

如果你使用的外掛不是WPML,則可以選擇自訂選項並為網站的翻譯版本新增URL。

帶有WPML的Language Switcher

將語言切換器新增到Header後,選擇類型-WPML。

這將自動獲取你使用WPML新增的語言。

如果要新增更多語言,可以使用WPML設定新增它們。
為此,控制台 > WPML > Languages > Site Languages > 新增/刪除語言。
從語言列表中選擇所需的語言,然後點擊 Save。

上一步中所有選擇的語言將在你的帶有Language Switcher的Header Builder中使用。

你可以使用以下選項來自訂語言導航的外觀

  • Layout排版:你可以水平或垂直顯示所有語言。水平排版最適合頁首,而垂直排版可適合頁尾。
  • Show Country Flag顯示國家/地區標誌:這將顯示與所選語言相關的國家/地區的標誌
    它可以幫助使用者快速找到所需的首選語言。
  • Show Name顯示名稱:這將顯示該語言的全名。
  • Show Translated Name顯示翻譯名稱:選擇特定語言後,將顯示所有語言的翻譯名稱。
    例如–如果你新增了4種語言-英語,法語,德語和北印度語。
    當你點擊德語時,所有語言都將以德語顯示其翻譯名稱。
  • Show Language Code顯示語言代碼:這將顯示每種語言的語言代碼。
    例如–英語(en)、法語(fr)、德語(de)和北印度語(hi)。

在 Design 選項卡下,你可以管理項目的間距、版型和大小。

帶有其他翻譯外掛的Language Switcher

如果你使用的不是WPML外掛,請按照以下步驟新增語言:

步驟1 –從下拉選單中選擇語言,然後點擊 Add Language 按鈕。

步驟2 –然後點擊語言。你可以更改其標籤並設定URL。
此URL是網站的翻譯版本,你可以從翻譯外掛中獲取。
只需在此處貼上相應語言的網址即可。

步驟3 –你可以從以下設定中管理其他內容,
例如水平/垂直排版,顯示國家/地區標誌和顯示語言名稱。

步驟4 –在 Design 選項卡下,你可以管理項目的間距,顏色和版型。


優化的Astra後台

在Astra 3.0.0發行版中提高了後台的速度之後,Astra現已徹底改造了Astra的控制後台

同時,讓我們看看在Astra 3.1.0中Astra的後台中可以期待什麼新變化。
更精緻的自訂和更清晰的欄位,顏色選擇器,重新設計的 General /Design 選項卡等。

Color Picker UI界面更新

現在,你會發現 Color Picker 位於具有 Normal/Hover 顏色欄位的外部,
而不是在編輯框內以及 Normal正常 和 Hover懸停 顏色部分的下面。

這意味著你可以更快地修改各個選項的顏色,而無需點擊太多。

舊的顏色UI選項–Normal/Hover

新的顏色UI選項–Normal/Hover

Spacing間距控制設計更新

間距控制選項包括 Padding內間距 和 Margin外間距 選項。
Astra已經更新了此網站設計,以使其外觀更好,更簡潔。

舊間距選項

新的間距選項

控制元件之間分隔線的簡潔 UI

在所有控制元件之間新增了更好的間距和分隔線,以更好地理解這些欄位。

拖放Meta結構更新

帶來更好的拖放Meta標籤結構,以便你可以更好地管理和理解欄位。

舊的拖放結構

新的拖放結構

滑動控制元件更新

滑動控制元件已使用WordPress的範圍控制選項

下拉/選擇區 轉成 多按鈕選項

Astra減少了管理所有下拉式選單的選項點擊次數。
現在只需從 多按鈕 中選擇選項即可快速設定頁面。

複選框已轉換為WordPress切換元件

Astra從左側的複選框選項手機到預設的WordPress切換元件選項,以快速啟用和禁用選項。

舊複選框選項

新的滑塊選項

對齊選擇欄位 轉成 多按鈕元件

正如上面的 下拉式 選單更新一樣,Astra已將 對齊 欄位轉換為 多按鈕 元件,以便更快地進行選擇。


在Header / Footer Builder中複製和刪除元件

使用Astra Header / Footer Builder,你可以輕鬆新增各種元件,
如LOGO、選單、按鈕、小工具等,並為你的網站創建獨特的導航。
使用Astra 3.1及更高版本,你將觀察到新的控制來複製和刪除頁首頁尾元件。

讓Astra更多地了解這些選項。

筆記
1.複製和刪除選項僅適用於Astra Pro。要使用這些選項,請確保你已更新並啟用了Astra Pro外掛。
2. 複製 和 刪除 選項僅適用於可以使用多個數字的元件。
例如–按鈕,選單,小工具等。這些元件不適用於LOGO,搜尋等單個元件。

複製頁首頁尾元件

顧名思義,此選項使你可以複製/再製 Header / Footer Builder 的元件。

複製將創建具有文本和样式的元件的精確副本。
這樣可以節省你重新設計類似元件的時間。

你只需拖放即可複製元件並輕鬆將其放置在所需位置。

在 Header / Footer Builder中,將滑鼠懸停在元件上時,你會看到小圖標來複製元件。
點擊此按鈕以複製元件。

刪除頁首頁尾元件

刪除選項使你可以從控制台中永久刪除不需要的元件。
一旦刪除,這些元件將不會顯示

只需將滑鼠懸停在元件上,然後點擊圖標以刪除元件。

刪除和移除的不同

你將在每個元件旁邊看到close(x)圖標。
此選項只會暫時將元件從視覺生成器中刪除。
你可以通過點擊視覺生成器中的加號(+)圖標來再次插入元件。

刪除選項

移除選項

筆記:
刪除:
從後台永久刪除元件,無法檢索該元件。
移除:僅從視覺生成器中移除元件,可以使用加號圖標將其新增回去。


常見問題解答– Astra Header / Footer Builder

Astra 3.0帶來了新的視覺效果–Header / Footer Builder。
這將為你提供在網站上設計頁首和頁尾的加強體驗。

如果你是Astra的現有客戶,並將Astra從2.6版本更新到3.0,這文章將幫助你入門。

小提醒(對於 Astra Pro 使用者)–
確保將Astra主題和Astra Pro外掛都更新到3.0版,以使用新的Header / Footer Builder。

如何啟用新的頁首/頁尾構建器?

將Astra主題和Astra Pro更新到版本3.0後,首先需要啟用新的Header / Footer Builder。
要啟用它,請導到 外觀 > Astra Options,然後點擊按鈕Use New Header/Footer Builder。

這將啟用 Header / Footer Builder,並在控制台中新增新選項。
你可以訪問自訂程式並在 Header / Footer Builder 選項卡下瀏覽新選項。

請注意,新的 Header / Footer Builder為自訂帶來了新的結構。
這提供了一個進階的視覺生成器,它可以替換舊的頁首和頁尾設定。
這樣,你的舊頁首/頁尾設計可能會進行一些更改,以適應新的結構。

如果你希望繼續使用舊的頁首/頁尾設定,可以跳過啟用新的設定。

如何回到舊的頁首和頁尾設定?

如果你啟用了新的Header / Footer Builder並且需要返回到舊的設定和設計,則可以輕鬆地回復。

轉到 外觀> Astra Options,點擊使用Use Old Header/Footer按鈕以切換回舊控件和設計。

你可以繼續使用Astra 3.0,並且仍然使用舊的頁首和頁尾設定。
但是Astra建議切換到新的Header / Footer Builder,以取得改版的好處。

為什麼我不應該回復並繼續使用新的Header / Footer Builder

Astra的未來更新將僅包括新的Header / Footer Builder的增強功能。
舊的頁首和頁尾控件的增強和修復將不再與Astra將來的更新一起發佈。

此外,新的Astra Header / Footer Builder提供了最先進的方法來設計創意頁首和頁尾。
它是一個簡單而強大的視覺生成器,可為你帶來出色的使用者體驗。

因此,Astra建議你切換到新的Header / Footer Builder並為你的網路行銷網站創建進階頁首/頁尾。

更新後我會保留什麼?

當你切換到新的Header / Footer Builder時,舊的頁首/頁尾設計將在新的3行結構中進行調整。
這種新結構將嘗試保留確切的舊頁首/頁尾設計。
你可能會在頁首/頁尾設計中觀察到一些小的變化,但是大多數元件和設計都將保留。

一些主要需要的頁首/頁尾元件將保留。
像LOGO,頁首中的主選單和版權,頁尾中的小工具。
幾乎沒有什麼事情會改變。這些事情會在下面提到。

更新後會發生什麼變化,我應該重新檢查什麼?

切換到新的Header / Footer Builder後,請檢查以下內容。
由於通過視覺生成器引入了新結構,因此很少有舊結構可能會更改。

1.新增到頁首/頁尾的任何自訂CSS將不再有效。

這是因為新結構包含新的CSS classes和targets。
因此,用舊目標編寫的自訂CSS將不起作用。
你可以檢查並定位新的CSS classes,並在需要時再次編寫CSS。

2.檢查手機和平板電腦視角。

將自訂視角切換到平板電腦/手機設備,並檢查其外觀是否相同。
新的 Header / Footer Builder使你可以與頁面頁首分開設計手機頁首。
你將在手機頭中獲得新的控件。這可能會稍微改變手機/平板電腦Header視圖。
同樣,在手機設備和平板電腦視圖上檢查頁尾。

3.頁首和頁尾中的元件。

許多新元件被新增到新的 Header / Footer Builder結構中,可以替代舊的元件。
例如–以前使用的頁尾 文本 部分中的 版權 部分。
在新結構中,你將看到新的專用版權元件,而不是文本。

因此,請檢查新增到頁首和頁尾的所有元件。

4.Spacing 間距

現在,上方,下方和主要頁首/頁尾具有專用的間距選項。
當你點擊齒輪圖標時,你會在 General 標籤下找到此選項。


如何使用Astra Header Builder創建手機Header

Astra Header Builder提供了專用選項來設計手機Header。
這些選項可用於Astra主題,而進階配置選項可用於Astra Pro。

編輯手機Header

一旦你切換到新的Header Builder,請訪問自訂。

步驟1–編輯Header Builder。

步驟2 –在控制台中切換到Tablet或Mobile預覽。

步驟3–你將在視覺Header Builder中看到一個單獨的專用框,用於手機Header。
off-canvas 部分允許你在切換按鈕內配置Header項目。
右側的視覺生成器使你可以使用LOGO和切換按鈕來配置手機Header的外觀。

步驟4 –在 off-canvas 部分中,點擊加號以新增Header元件,例如主選單,按鈕,小工具,HTML等。

步驟5 –點擊齒輪圖標以設定手機Header類型,顏色和其他選項。

你可以從以下選項中選擇Header類型:

  • Flyout
  • Full-Screen
  • Dropdown

在 Design 選項卡下,你可以找到顏色選項。

步驟6 –如果需要編輯 Toggle button,請點擊它並開始配置。

步驟7–你可以從Header Builder> Header Types下的自訂啟用 Transparent Header for mobile 。
選擇將其顯示在手機設備上並進行配置。

同樣,使用Astra Pro,你可以選擇Sticky Header


如何使用Astra Footer Builder創建Footer頁尾?

Astra Header / Footer Builder是在Astra中設計創意頁首/頁尾的新的進階方法。
文章將幫助你了解如何入門,並且Astra Header / Footer Builder都提供了所有可用選項。

Header / Footer Builder入門

一旦安裝了Astra主題,請導到 外觀 > Astra Options下的Astra歡迎頁面。
在這裡,你會看到一條小提示和一個顯示 使用Use New Header/Footer Builder 的按鈕。

點擊按鈕開始使用 新Header / Footer Builder 進行設計。

然後通過點擊轉到自訂來訪問後台。
進入自訂後,你將看到Header Builder和Footer Builder的新選項。

編輯Footer頁尾

Footer Builder包含:

  • 可視化Footer Builder–具有上頁尾,主頁尾和下頁尾。
  • General選項卡
  • Design選項卡

你可以使用可視化編輯器新增和管理Footer元件,並在 General 和 Design 選項卡中對其進行自訂。

可視化Footer Builder

可視化Footer Builder是一種靈活而先進的頁尾構建器。
你在視覺生成器中所做的更改將立即反應在頁尾設計中。 

  • 它為你提供3行以構建獨特的頁尾結構-上方,主要和下方
  • 你可以點擊加號以新增不同的頁尾元件-按鈕,HTML,頁尾選單,小工具,社群,版權
  • 你可以將小工具拖放到不同的部分,以將其放置在所需的位置。 

配置Footer上方,主要和下方區塊樣式 

點擊每個頁尾部分上方的設定圖標,它將直接帶你到樣式選項。 

General選項卡

你在可視頁尾構建器中新增的元件將在 General 選項卡下可用。
你可以點擊單個元件並編輯設定。

Design選項卡

這將為你提供頁尾背景和間距的設計選項。

具有Astra主題和Astra Pro的Footer Builder元件 

Astra主題為新的Footer Builder提供了完整的結構。
雖然你可以使用Astra Pro解鎖進階功能。

這是可用於Astra主題和Astra Pro的Footer元件列表  

使用Astra 

  • Copyright
  • HTML 1
  • HTML 2
  • Widget 1
  • Widget 2
  • Widget 3
  • Widget 4
  • Social
  • Foot Menu

使用Astra Pro 

  • Copyright
  • Button 1
  • Button 2
  • HTML 1
  • HTML 2
  • Footer Menu
  • Social
  • Widget 1
  • Widget 2
  • Widget 3
  • Widget 4
  • Extra Footer Layouts and Columns

小提醒:你可以在Astra Pro中進一步擴展元件數量。


如何使用Astra Header Builder創建Header?

通過點擊轉到控制台來訪問控制台。
進入自訂後,你將看到Header Builder和Footer Builder的新選項。

編輯Header

Header Builder包含–

  • 可視化 Header Builder –具有above header、primary header和 below header。
  • General選項卡
  • Design選項卡

你可以使用可視化編輯器新增和管理Header元件,並在 General 和 Design 選項卡中對其進行自訂。

可視化Header Builder

可視化Header Builder是一種靈活而進階的Header生成器。
你在視覺生成器中所做的更改將立即反應在Header設計中。 

  • 它為你提供3行以構建唯一的頁首結構-上面,主要和下面
  • 你可以點擊加號以新增不同的Header元件-按鈕,HTML,小工具,社交,主選單,輔助選單
  • 你可以將小工具拖放到不同的部分,以將其放置在所需的位置。 

筆記:
現在,可以在 自訂 > Header Builder > General > LOGO下找到

配置Header上方,主要和下方區塊樣式 

點擊每個Header部分上方的設定圖標,它將直接帶你到樣式選項。 

General選項卡

你在視覺Header Builder中新增的元件將在 General 選項卡下可用。
你可以點擊單篇元件並編輯設定。

Design選項卡

這將為你提供頁首寬度和間距的設計選項。

Header Types

你將在 General 選項卡下看到另一個選項卡,即 Header Types。
這將為你提供配置不同Header類型的選項。 

使用Astra主題,你可以啟用透明頁首並對其進行配置。 
使用Astra Pro,你可以選擇Sticky Header。 

筆記:
在Header Builder中Astra還有其他可用元件,例如WooCommerce購物車,EDD購物車
出於同樣的原因,你可能需要新增一些其他外掛。

設計手機Header

借助Astra Header Builder,你可以在響應式設備上設計Header外觀。

具有Astra主題和Astra Pro的Header Builder元件 

Astra主題為新的Header Builder提供了完整的結構。
雖然你可以使用Astra Pro解鎖進階功能。

這是可用於Astra主題和Astra Pro的Header元件的列表  

使用Astra 

  • Button
  • HTML 1
  • HTML 2
  • Logo
  • Primary Menu
  • Secondary Menu
  • Search
  • Social

使用Astra Pro 

小提醒:你可以在Astra Pro中進一步擴展元件數量。

  • Button 1
  • Button 2
  • HTML 1
  • HTML 2
  • Logo
  • Primary menu
  • Secondary Menu
  • Search
  • Widget 1
  • Widget 2
  • Widget 3
  • Widget 4

在Header / Footer Builder中新增多個元件

Astra Header / Footer Builder允許你將以下元件新增到頁首和頁尾部分–

  • Button
  • HTML
  • Widgets
  • Social
  • More will be added in future

在免費的Astra主題中,這些元件的數量是有限的,但是使用Astra Pro可以擴展它。
例如–如果點擊以在Header中新增新元件,你將小提醒到兩個可用按鈕。

但是,借助Astra Pro,你可以擴展可用按鈕的數量,並且可以具有兩個以上的按鈕。

不只是按鈕,還可以為HTML、Widget小工具和Social新增多個元件。

新增多個元件(按鈕、HTML、Widget小工具和Social社群)的步驟

步驟1 –確保已啟用Astra Pro外掛。
步驟2 –你將需要為多個元件新增自訂代碼,因此請確保已安裝並啟用了Astra子主題。
步驟3 –編輯Astra子主題的functions.php文件,並新增以下自訂代碼。

你只能從以下代碼中新增必填欄位。

/**
 * Update the count of elements in HF Builder.
 *
 * @param array $elements array of elements having key as slug and value as count.
 * @return array $elements
 */
function astra_builder_elements_count( $elements ) {
    $elements['header-button']       = 3;
    $elements['footer-button']       = 3;
    $elements['header-html']         = 3;
    $elements['footer-html']         = 3;
    $elements['header-widget']       = 3;
    $elements['footer-widget']       = 3;
    $elements['header-social-icons'] = 3;
    $elements['footer-social-icons'] = 3;
    return $elements;
}
add_filter( 'astra_builder_elements_count', 'astra_builder_elements_count', 10 );

在上面的代碼中,你將在頁首和頁尾中觀察到所有元件的不同參數。
你可以為所有參數設定所需的計數。
在上面的代碼中,出於演示目的將其設定為3。

你可以根據元件及其編號的要求編輯以上代碼。

例如–假設你在頁尾構建器中需要6個小工具。
因此,你可以使用的代碼是

/**
 * Update the count of elements in HF Builder.
 *
 * @param array $elements array of elements having key as slug and value as count.
 * @return array $elements
 */
function astra_builder_elements_count( $elements ) {
    $elements['footer-widget']       = 6;
    return $elements;
}
add_filter( 'astra_builder_elements_count', 'astra_builder_elements_count', 10 );

同樣,你可以選擇一個參數並設定所需的編號。


常見問題解答2– Astra Header / Footer Builder

什麼是Astra Header / Footer Builder

Astra Header / Footer Builder是Astra自訂中的新視覺生成器。
這是為你的網站設計創意頁首和頁尾的一種有效方法。
你可以在頁首/頁尾中新增各種項目,並通過簡單的拖放來安排結構。

3.0.0及更高版本中的Astra主題將提供此功能。Astra Pro 3.0.0及更高版本將提供進階選項。

我如何獲得Astra Header / Footer Builder

Astra頁首/頁尾生成器內建Astra主題,而Astra Pro為其新增了進階選項。

新的Header / Footer Builder會影響舊的設計?我現在的Header / Footer設計會被移除嗎?

不,當你選擇使用新的Header / Footer Builder時,舊的設計將不會被遷移。
你將需要重建舊的頁首/頁尾設計。
啟用新的Header / Footer Builder後,舊的設計將被替換,並且不會再看見。

如果你希望繼續使用舊的頁首/頁尾設定,則可以從Astra Options中選擇選項(外觀 >  Astra Options > Use Old Header/Footer)。

我的Astra Pro Header Above上方和Below下方會發生什麼?

現在,Astra主題將提供 Header上方和下方 。
雖然進階選項將來自Astra Pro。
當你切換到新的Header / Footer Builder時,你將不得不重建舊的設計。

新的Header / Footer Builder中的版型、間距、顏色和背景插選項會發生什麼情況?

對於新的Header / Footer Builder,所有的版型、間距、顏色和背景選項將保持不變。
這意味著當你啟用這些附加組件時,各個選項將被新增到自訂程式中,
以用於各個元件,例如主選單,次選單等。

Astra主題和Astra Pro外掛有哪些不同的元件?

這邊是帶有Astra主題和Astra Pro的新Header / Footer Builder中可用的小工具的完整列表。

我的元件數量有限制?可以在頁首/頁尾中使用多個元件嗎?

你可以在上面列表中提到的新增所有元件。
但是,如果你需要更多元件,則可以使用Astra Pro來獲得。


Astra主題和Astra Pro的頁首/頁尾生成器中的元件

 Header Builder

Astra ThemeAstra Pro
LogoLogo + 1 extra option
Primary MenuPrimary Menu
Secondary MenuSecondary Menu
Button 1Button 2 + upto 10
HTML 2HTML 2 + upto 10
Widget 2Widget 4 + upto 10
SearchSearch + 1 extra option
Social ShareSocial Share 1 + upto 10
WooCommerce CartWooCommerce Cart + 1 extra option
EDD CartEDD Cart + 1 extra option
Off-Canvas Menu (on Mobile & Tablet)Off-Canvas Menu 1 + extra options (on Mobile & Tablet)
AccountAccount 1 + extra options
Divider 3 + upto 10
Language Switcher [NEW]
Toggle Button (for Desktop) [NEW]

 Footer Builder

Astra ThemeAstra Pro
Footer MenuFooter Menu 1 + extra options
Social ShareSocial Share 1+ upto 10
HTML 1HTML 2 + upto 10
Widget 4Widget 6 + upto 10
Copyright 1Copyright 1 + extra options
Button 2+ upto 10
Divider 3 + upto 10
Language Switcher [NEW]

1 thought on “Astra主題教學指南-Header / Footer Builder設定”

  1. Pingback: Astra Pro模組教學指南-Native AMP支援 – Ez2.HELP

Leave a Comment

Shopping Cart
回到頂端
Malcare WordPress Security