一句語法都不用寫的情況下,把網站中任何物件的可視度進行設置 | 網設俱樂部 | Visibility Logic for Elementor

一句語法都不用寫的情況下,把網站中任何物件的可視度進行設置 | 網設俱樂部 | Visibility Logic for Elementor

透過安裝 Visibility Logic for Elementor,我們可以輕鬆管理網站的開課時間表,實現自動隱藏功能。這不僅提升了網站的效率,也讓管理變得更加直觀簡單。有興趣的朋友可以試著操作看看,享受這個自動化的便利功能!

文章大綱

Views: 457

今天要跟大家分享一個 駕訓班教練網站 的操作教學。這個網站上提供了教練的介紹、開課與結訓日期的清單,以及報名相關的資訊,還包括影片說明等內容。

過去管理開課時間表比較麻煩,因為需要手動刪除過期的課程資訊。但現在我們可以透過 Elementor 搭配外掛來自動控制課程顯示,非常方便!以下就來一步步說明如何設定。


網站原本的結構

這個網站使用 Elementor 製作,每一個課程的資訊是用容器(container)來排版,裡面用內部段(Inner Section)進行細部配置。如果是用舊版本的 Elementor,可以用內部段去新增標題和內容,然後一排排地排列整齊。但今天我們要升級功能,讓課程能依時間自動隱藏,這就需要外掛的幫忙。


安裝所需外掛

  1. Visibility Logic for Elementor
    這個外掛可以幫我們設定課程資訊的可見邏輯,達到在指定時間內顯示或隱藏的效果。不需要額外寫程式碼,非常簡單。
  2. IF MENU(選單可見度控制,可選安裝)
    如果需要控制選單的顯示條件,也可以使用這個外掛。

我們接下來專注於 Visibility Logic for Elementor 的應用。


設定可見邏輯

  1. 新增 Visibility 設定
    安裝外掛後,進入 Elementor 的編輯畫面,點選要設定的課程資訊。每個容器上會多出一個 “Visibility” 的選項,點進去後啟用 Enable
  2. 設定顯示條件
    在 Visibility 的設定中,可以選擇課程顯示的時間範圍。

    • 例如:設定從 10 月 2 日到 12 月 2 日之間顯示,超過這段時間課程資訊就會自動隱藏。
    • 若要延長顯示,可以將結束時間調整為結訓後的隔天,例如 12 月 3 日,這樣讓報名者知道課程已結束。
  3. 逐步設定每個課程
    • 選擇每個課程的時間範圍,設定完成後記得 發佈
    • 設定好的課程,會在容器旁邊顯示一個小眼睛的圖示,代表 Visibility 功能已啟用。
  4. 測試效果
    回到前台,重新整理頁面。若系統時間已超過設定範圍,該課程就會自動隱藏。

優化管理流程

設定完成後,網站的時間表可以自動運作,省去了手動刪除過期課程的麻煩。未來新增新一年的課程時,只需修改標題與時間範圍即可,舊課程則會依時間自動隱藏。


總結

透過安裝 Visibility Logic for Elementor,我們可以輕鬆管理網站的開課時間表,實現自動隱藏功能。這不僅提升了網站的效率,也讓管理變得更加直觀簡單。有興趣的朋友可以試著操作看看,享受這個自動化的便利功能!

希望這篇教學對你有所幫助! 😊

發佈留言