元素

元素有助於有效地組織和呈現內容。它們包括基於文字的組件,如標題清單文字醒目提示,以及互動式組件,如按鈕連結。還可以加入視覺元素,如圖片圖示影片動畫,以改善內容的呈現和組織。

如需加入或修改網站元素:

  1. 導覽至相關網站頁面並按一下編輯

  2. 按一下頁面上您要加入或修改元素的區段。

  3. 進行必要的變更。

  4. 按一下儲存

備註

例如,標題、按鈕、連結和段落文字的預設樣式,是在網站編輯器的佈景主題分頁中定義的。

輸入 / 以加入網站元素。

標題

標題用於定義標題並將網站內容組織成不同層級,以提供清晰的結構。若要插入標題,請輸入 /title,選擇標題樣式(標題 1標題 2標題 3),然後輸入文字。

小訣竅

或者,輸入文字、選取該文字,並從網站編輯器的自訂分頁中的內聯文字區段選擇適當的樣式。此區段中也提供其他格式選項,例如字型和顏色。

按鈕

按鈕是互動式元素,可以連結到另一個頁面或頁面錨點。若要插入按鈕:

  1. 輸入 /button

  2. 連結標籤欄位中輸入按鈕的標籤。

  3. 加入網址或電子郵件。輸入 / 以搜尋頁面,輸入 # 以連結到錨點。

  4. 設定樣式大小版面配置以定義按鈕的外觀。

  5. 如有需要,切換開關以在新分頁中開啟連結的頁面或錨點。

  6. 按一下套用以儲存變更。

小訣竅

若要修改現有按鈕,請按一下按鈕並在網站編輯器的內聯文字區段中編輯選項。

圖片

若要插入圖片:

  1. 輸入 /image

  2. 搜尋 Unsplash 資料庫或按一下上載圖片以從本機圖片中選擇檔案。

  3. 按一下 加入

  4. 若要自訂圖片,請按一下圖片並在網站編輯器的圖片區段中編輯選項。例如:

    • 替換圖片。

    • 說明欄位中定義替代標籤

    • 工具提示欄位中輸入標題標籤。當訪客將滑鼠懸停在圖片上時,此文字將會顯示。

    • 加入形狀;某些形狀也允許自訂顏色。

    • 調整圖片的寬度,例如以提升效能。如果較小的尺寸足以顯示,系統可能會建議使用。

    • 使用變形工具調整圖片大小。

    • 調整邊距以在圖片周圍加入空間(以像素為單位)。

    • 等。

影片

若要加入影片,請輸入/video,插入網址,然後開啟所需選項:

  • 自動播放:在存取頁面時自動播放影片。影片預設會自動靜音。

  • 循環播放:循環播放影片。

  • 隱藏播放器控制項

  • 隱藏全螢幕按鈕

  • 開始於:以`分鐘:秒`格式定義影片應開始的時間戳記。

圖示

若要插入圖示,請輸入/image,前往圖示分頁,選取一個圖示,然後按一下加入。若要修改圖示,請按一下該圖示,並使用網站編輯器的圖示區段自訂選項,例如顏色大小動畫形狀等。

清單

清單有助於清楚組織內容,使資訊更易於閱讀並改善網頁結構。輸入/list並從三種不同類型的清單中選擇:項目符號清單編號清單核取清單

文字醒目提示

可在網站編輯器的行內文字區段中為標題和文字加入醒目提示。若要加入醒目提示:

  1. 選取您要醒目提示的文字或標題。

  2. 在網站編輯器中,按一下醒目提示

  3. 選擇醒目提示樣式。

  4. 修改其顏色

  5. 選擇其粗細

醒目提示文字和標題

動畫效果

動畫用於為構建區塊和網站元素(例如圖片和文字)加入動態效果。有三種類型的動畫可用:捲動時出現時懸停時(僅限圖片)。

若要為網站元素加入動畫:

  1. 按一下該元素。

  2. 在網站編輯器中,前往該元素的相關區段(例如按鈕行內文字等)。

  3. 動畫欄位中,選擇所需的動畫類型。

  4. 根據需要自訂動畫設定。可用選項會根據所選的動畫類型而有所不同。

捲動時的動畫

對於捲動時的動畫,可以:

  • 選擇進入以在元素進入螢幕時加入動畫,並選擇離開以在元素離開螢幕時加入動畫。

  • 選擇效果

  • 選擇效果的方向

  • 調整效果的強度

  • 定義捲動區域,其中第一個值代表效果開始時顯示的螢幕百分比,第二個值代表效果結束時的百分比。

出現時的動畫

對於出現時的動畫,可以:

  • 從不同的效果中選擇。

  • 選擇效果的方向

  • 選擇觸發選項以定義動畫何時發生:僅第一次每次

  • 調整效果的強度

  • 如果您希望動畫在指定秒數後觸發,請在延遲啟動欄位中定義該秒數。

  • 為動畫選擇持續時間

懸停動畫(僅限圖片)

懸停時的動畫可以加入到圖片中。您可以選擇動畫的效果顏色以及筆畫寬度

其他資料

Odoo HTML 編輯器