Elementor 教學 – 利用 JetEngine 建立 Options Page 管理網站重複出現的資訊

利用 JetEngine 建立 Options Page 可以有效率的管理網站上重複出現的資訊，例如聯絡資訊 (信箱、電話、地址) 等。善用 Options Page 的設定，可以快速地更改整站共用的資料，省去了開啟 Elementor 編輯器編輯的時間，也能避免頁面資訊不同步的問題。

如何建立 Options Page？

(1) 安裝並啟用 JetEngine
(2) 於 WordPress 後台 / JetEngine / Options Pages / 點擊 Add New 建立一個 Options Page

Options Page 的設定欄位

General Settings

1. Page title：名稱
2. Page slug：路徑，用於儲存 Options Page 上面的資料
3. Menu name：在 WordPress 後台顯示的名稱
4. Menu Icon：在 WordPress 後台顯示的 icon
5. Access capability：設定編輯權限
6. Menu position：在 WordPress 後台顯示的位置

Fields

可以在 Options Page 編輯的欄位。

Fields 的使用情境

1. 聯絡資訊 (信箱、電話、地址)：這些資訊不一定只出現在網站的頁尾 (footer)，也可能出現在內頁的區塊中，例如聯絡頁面有時候也會放置聯絡資訊，使用 Options Page 可以一次更新這些資訊
2. 相同資料出現在不同頁面：例如客戶見證、成員介紹等區塊在不同頁面上出現時，透過 Options Page 的設定，只需要在一處更新資料，就能確保資料的一致性，且無需重複更新

使用動態標籤串接 Options Page

開啟 Elementor 編輯畫面，點選需要串接的小工具，點擊編輯欄位右側的「動態標籤」後，選擇 JetEngine / Option，在下拉選單中選擇對應的 Field。

更新 Options Page 裡面的 Fields

在 WordPress 後台可以看到在建立 Options Page 時命名的名稱與設定顯示的位置，若前台顯示的資訊有更新的需求，可以在設定的位置進行更新。

範例網站：Hiishen

小結

利用 JetEngine 建立 Options Page 可以有效管理網站上出現的重複資訊，其實它的應用可以更廣，近期的專案我搭配了 Listing，建立了一個可以自訂樣式的 slider，等專案上線再分享給大家吧！