新增內容 — 動態區塊
使用動態區塊內容型別將現有的動態區塊新增至Page Builder 階段。
店面上的
動態區塊工具箱






將現有的動態區塊新增到舞台
-
導覽至目標頁面、區塊、產品或類別上的Page Builder工作區。
-
在Page Builder面板中,展開 Add Content 並將 Dynamic Block 預留位置拖曳到舞台。
-
將滑鼠懸停在空的動態區塊容器上以顯示工具箱,然後選擇 設定 (
-
在 編輯動態區塊 頁面上,按一下 Select Dynamic Block 並使用清單來選取區塊。
在清單中,找到您要插入的動態區塊,然後按一下 Select。 然後,按一下 Add Selected。
動態區塊資訊的摘要會顯示於下方。
-
將 Template 設定為下列其中一項:
table 0-row-2 1-row-2 2-row-2 layout-auto 選項 說明 Dynamic Block Block Template
新增獨立區塊。 Dynamic Block Inline Template
將區塊內容插入文字中。 -
視需要完成「進階」設定。
-
完成後,按一下 Save 套用設定並返回Page Builder工作區。
進階設定
-
若要控制動態區塊在父容器中的位置,請選擇 Alignment:
table 0-row-2 1-row-2 2-row-2 3-row-2 4-row-2 layout-auto 選項 說明 Default
套用目前佈景主題樣式表中指定的對齊預設設定。 Left
沿著父容器的左邊框對齊清單,並允許指定的任何邊框間距。 Center
將清單對齊父項容器的中心,並容許任何指定的內距。 Right
沿著父容器的右邊框對齊區塊,並允許指定的任何邊框間距。 -
設定套用至動態區塊容器所有四個側面的 Border 樣式:
table 0-row-2 1-row-2 2-row-2 3-row-2 4-row-2 5-row-2 6-row-2 7-row-2 8-row-2 9-row-2 10-row-2 layout-auto 選項 說明 Default
套用關聯樣式表所指定的預設邊框樣式。 None
未提供任何容器框線的可見指示。 Dotted
容器邊框會以虛線顯示。 Dashed
容器邊框會以虛線顯示。 Solid
容器邊框會以實線顯示。 Double
容器邊框會以雙線顯示。 Groove
容器框線會顯示為槽線。 Ridge
容器框線會顯示為脊線。 Inset
容器框線會顯示為內嵌線。 Outset
容器邊框會顯示為外線。 -
如果您設定了
None
以外的框線樣式,請完成框線顯示選項:table 0-row-2 1-row-2 2-row-2 3-row-2 layout-auto 選項 說明 Border Color 選擇色票、按一下檢色器,或輸入有效的顏色名稱或相等的十六進位值,以指定顏色。 Border Width 輸入邊框線條寬度的畫素數。 Border Radius 輸入畫素數目,以定義用來將邊框每個角落倒圓角的半徑大小。 -
(選擇性)從目前的樣式表中指定要套用至容器的 CSS classes 名稱。
以空格分隔多個類別名稱。
-
輸入 Margins and Padding 的值(以畫素為單位),以決定動態區塊容器的外部邊界和內邊距。
在圖表中輸入對應的值。
table 0-row-2 1-row-2 2-row-2 layout-auto 容器區域 說明 Margins 套用至容器所有側邊外部邊緣的空白空間量。 選項: Top
/Right
/Bottom
/Left
Padding 套用至容器所有邊內側邊緣的空白空間量。 選項: Top
/Right
/Bottom
/Left
編輯動態區塊容器設定
-
將游標停留在動態區塊容器上以顯示工具箱,然後選擇 設定 (
-
如有需要,請變更動態區塊:
-
按一下 Select Dynamic Block。
-
在使用中動態區塊清單中,按一下您要新增區塊的 Select。
-
-
視需要更新其餘的設定。
-
完成後,按一下 Save 套用設定並返回Page Builder工作區。
複製動態區塊
-
將游標停留在動態區塊容器上以顯示工具箱,然後選擇 複製 (
重複專案會出現在原始專案的正下方。
-
若要將新的動態區塊移至其他位置,請將游標暫留在容器上,然後在工具箱中選擇 「移動」(
-
選取並拖曳動態區塊,直到紅色指引出現在新位置為止。
移動動態區塊時,每個容器的頂端和底部邊界都會顯示為虛線。
從舞台移除動態區塊
-
將游標停留在動態區塊容器上以顯示工具箱,然後選擇 移除 (
-
提示確認時,按一下 OK。