使用Advanced Floating Content 來設定 WordPress可以根據不同的頁面、螢幕高度尺寸顯示對應的浮動內容

作者 Andy

本篇文章將解決您的網站需要使用浮動按鈕或訊息時的需求,在不同的頁面、螢幕高度尺寸時可以顯示不同的浮動內容。

首先請安裝Advanced Floating Content外掛

安裝且啟用完到後台,點選Add New新增一個項目。

以圖片的方式製作一個頁面連結的簡單內容作為範例,首先在新增媒體的部分加入圖片。
需要以文字建立浮動內容的人也可以插入文字,做法是一樣的。

Position Your Floating Content欄位:主要處理固定方式跟內容的選擇跟內容位置設定,可以根據要設定的內容文字或文字調整。
Fixed:固定
Absolute:頁面絕對位置
Scroll:滾動

Build Your Theme For Floating Content欄位:主要處理是否關閉按鈕相關設定,及背景、邊框設定。

特別提醒一下Padding的四個輸入框的順序是:上、右、下、左,有需要分別設定的使用者請特別注意。
padding:內容跟邊框的距離。
Border:框線。

Floating Content Controlling Options欄位:上半部主要控制浮動內容顯示的頁面、標籤、文章等等。

點選Only Selscted Posts之後可以選擇目前已經建置的頁面、標籤等位置,換言之就是可以在每一個不同的頁面給出不同的內容,具有相當高的靈活度,是這個外掛的優點之一。

這個區塊有用到Woocommerce購物車外掛的使用者,可以選擇如何顯示在Woocommerce Products Page或Categories,相當方便。
下面的區塊,偏向Mobile控制,可以控制多少高度才顯示,或多少高度就隱藏,在Windows或Mac OS 隱藏等項目。

也有提供css控制器可以控制外觀。

右側邊欄可以選擇進出場的動畫,Schedulevm可以設定開始結束的時間。

 

以下用google圖示做示範

WordPress 商業網站實戰工作坊:https://lihi.one/jATUt

Andy

我是許哲維,資深的 WordPress 使用者。

WordPress架站費用比客製化網站便宜嗎?購物、公司、個人網站適合用WP嗎?

什麼網站適合用 WordPress 架站?一般人家說的 WordPress 網站設計包含什麼?除了個人網站,利用 WordPress 架購物網站/形象網站也綽綽有餘?WordPress 架站前請先看這篇。

tawk.io線上客服簡單介紹

當看到某個網站內容是我們感興趣也有疑問的時,會希望能趕緊聯絡到站長發問,一般來說最常見到的方式就是填寫表單,還有今天要來介紹一的即使通訊服務tawk.io

Facebook messenger如何嵌入WordPress網站呢

現在的網站不可或缺的一個元素,就是即時客服的部分,這篇文章會教你網站如何加入對話框,讓使用者可以跟你在粉絲團的messenger系統直接交流,以解決使用者在瀏覽網站中的問題。

GeneratePress 網頁速度最佳化的三個做法

使用 GeneratePress 製作,使用體驗還算不錯,簡潔輕便,整個檔案大小約 1MB在網頁載入速度的調整,除了快取外,也沒特別做什麼設定,PageSpeed 分數已經是有及格的了。