Wordpress x Elementor

Elementor教學

圖庫與輪播功能

基本圖庫

下面是範例呈現 

  1. 上傳和管理照片:
    點擊“添加圖片”按鈕上傳圖片,並通過拖動圖片來調整它們的順序。

  2. 自定內容與樣式:
    在”內容”中設置欄多寡、是否開啟燈箱、排列是否隨機。在”樣式”中設置圖片的間距與圓角。與gallery不同的是基本圖庫沒有hover效果。

  3. 設置圖片屬性:
    點擊圖片的編輯器為每張圖片添加標題、描述和鏈接,以提供更多信息或導航。

Gallery

下面是範例呈現

  1. 上傳和管理照片:
    點擊“添加圖片”按鈕上傳圖片,並通過拖動圖片來調整它們的順序。

  2. 自定內容與樣式:
    在”內容”的type中可以選擇是否需要建置多個圖庫、是否開啟燈箱、欄位。在”樣式”中設置圖片的間距與圓角、塗層效果,並設置動畫效果。與基本圖庫不同的是gallery有hover動畫。

  3. 設置圖片屬性:
    點擊圖片的編輯器為每張圖片添加標題、描述和鏈接,以提供更多信息或導航。

Loop Carousel

下面是範例呈現 

  1. 新增小工具:在Elementor編輯器中,從元素庫中將「Loop Carousel」小工具拖放到頁面上。
  2. 設置內容查詢(Query)
    在“內容”選項卡中,設置查詢條件來定義要顯示的內容。您可以依據分類、標籤或其他分類法來篩選文章或產品。最後調整顯示項目的數量、排序方式等設置。
  3. 自定義樣式:進入“樣式”選項卡,自訂 Carousel 中每個項目的外觀。這包括圖片、標題、摘要和按鈕等元素的設計。
  4. 詳細設定:在“進階”選項卡中,設置 Carousel 的行為參數,如每個幻燈片顯示的項目數量、自動播放、循環播放及導航按鈕等。

Media Carousel

下面是範例呈現

  1. 新增小工具: 在 Elementor 編輯器中,搜尋並拖放 “Media Carousel” 小工具到頁面。

  2. 添加多媒體內容: 點擊slide裡的item,,“添加圖片”或“添加影片”,從媒體庫中選擇或上傳文件。

  3. 配置與自訂: 設置顯示方式(skin)和樣式,包括導航控制、和外觀調整。

Slider

下面是範例呈現

Slide 1 Heading
Lorem ipsum dolor sit amet consectetur adipiscing elit dolor
Click Here
Slide 2 Heading
Lorem ipsum dolor sit amet consectetur adipiscing elit dolor
Previous slide
Next slide

  1. 新增小工具: 在 Elementor 編輯器中,搜尋並拖放 “Slider” 小工具到頁面。

  2. 添加幻燈片: 點擊“添加幻燈片”,設置圖片、標題、文字和按鈕內容。

  3. 配置與自訂: 設置自動播放、過渡效果和導航控制,自訂滑動速度和樣式。

Related Posts

如何有效管理你的頁面

網站頁面是您網站內容的基石,對於網站的結構、SEO ...
Read More →

新手必看:如何在後台新增與管理頁面

在網站建設過程中,新增頁面是不可避免的一個步驟。無 ...
Read More →

如何建立合規的隱私權政策頁面:隱私權設定

隱私權設定對於確保網站合規性和保護用戶個人資料至關 ...
Read More →