行銷圖片彈窗
在公開網站顯示活動圖片與可點擊區域。
共 5 項操作・19 個步驟・最後複驗 2026-08-03
從哪裡進入
網站後台 → 行銷圖片彈窗
照著下方圖文逐步完成
重點摘要（TL;DR）
彈窗可依延遲、捲動或離站意圖出現，並控制同一位訪客看到的頻率。
什麼時候會用到
- 要宣傳限時活動或重要公告
開始前先準備
- • 準備桌機與手機圖片，並確認素材權利
操作步驟與完成後的結果
每一項操作都列出從哪裡開始、要做什麼，以及完成後應該看到的結果。
上傳桌機與手機圖片
彈窗會依裝置顯示適合桌機或手機比例的活動圖片。
- 1
這一步要做
到網站後台的「行銷圖片彈窗」，在「桌機／通用主圖片」上傳主圖片。
完成後會看到
桌機預覽區會顯示主圖片。
- 2
這一步要做
若手機要用不同構圖，在「手機專用圖片（選填）」上傳直式或窄版圖片。
完成後會看到
切到手機設定時會顯示手機專用圖片；留空則沿用主圖片。
- 3
這一步要做
在「圖片替代文字」寫出圖片重點，例如「週年慶全館九折」。
完成後會看到
圖片無法顯示或被輔助工具讀取時，仍有可理解的文字。
- 4
這一步要做
按「儲存設定」。
完成後會看到
圖片與替代文字會被保存。
注意事項
- • 桌機／通用主圖片是開啟彈窗的必要資料。
- • 圖片不要只放小字；手機縮小後仍要看得清楚。
在圖片上框選連結熱區
訪客點圖片中的指定區域，就能前往活動頁、商品頁或其他網址。
- 1
這一步要做
在「圖片連結區域」先選「桌機」或「手機」。
完成後會看到
畫面會顯示該裝置使用的圖片。
- 2
這一步要做
按「框選連結區域」，在圖片上拖曳框出可點擊範圍。
完成後會看到
圖片上會出現一個熱區框與對應設定欄。
- 3
這一步要做
輸入「區域說明」與「前往連結」，需要時勾選「在新分頁開啟」。
完成後會看到
該熱區會記住用途、網址與開啟方式。
- 4
這一步要做
桌機與手機圖片構圖不同時，分別切換「桌機」、「手機」重新框選，再按「儲存設定」。
完成後會看到
兩種裝置會各自使用正確位置的可點擊區域。
注意事項
- • 啟用彈窗前至少要有一個有效熱區。
- • 連結請用完整網址或正確站內路徑，並避免讓熱區蓋住關閉按鈕。
設定觸發時機
彈窗會在進站、停留、捲動或準備離開時出現。
- 1
這一步要做
在「顯示規則」找到「何時出現」。
完成後會看到
畫面會顯示可選的觸發方式。
- 2
這一步要做
選「進站立即顯示」、「停留幾秒後」、「捲動到指定進度」或「準備離開頁面時」。
完成後會看到
下方會顯示該方式需要的秒數或捲動百分比。
- 3
這一步要做
若選停留或捲動，輸入秒數或百分比，再按「預覽彈窗」。
完成後會看到
預覽會以目前圖片、尺寸與熱區顯示彈窗。
- 4
這一步要做
按「儲存設定」。
完成後會看到
公開彈窗會依選定時機判斷是否出現。
注意事項
- • 「準備離開頁面時」在手機無法偵測滑鼠離開，系統會改用約 8 秒後顯示。
- • 進站立即顯示較容易打擾訪客，先確認活動真的重要。
設定顯示頻率
同一位訪客不會被過度重複打擾，或可依活動需要每次顯示。
- 1
這一步要做
在「顯示規則」找到「同一位訪客多久再顯示」。
完成後會看到
畫面會顯示頻率選項。
- 2
這一步要做
選擇每頁、每次瀏覽、24 小時、7 天或只顯示一次的選項。
完成後會看到
系統會依所選頻率記住這位訪客是否已看過。
- 3
這一步要做
按「儲存設定」。
完成後會看到
新的顯示頻率會套用到公開網站。
注意事項
- • 頻率會依訪客瀏覽器的儲存資料判斷；清除網站資料或換瀏覽器後會被視為新訪客。
- • 重要公告若選「只顯示一次」，訪客關掉後不會再看到。
啟用後用無痕視窗測試
你能用全新訪客的狀態確認彈窗會出現、可關閉，且熱區連結正確。
- 1
這一步要做
確認已有「桌機／通用主圖片」與至少一個有效熱區，再勾選「在公開網站顯示行銷圖片彈窗」。
完成後會看到
彈窗會變成可啟用狀態。
- 2
這一步要做
按「儲存設定」，再用瀏覽器開啟新的無痕視窗。
完成後會看到
無痕視窗會以尚未看過彈窗的新訪客狀態開啟。
- 3
這一步要做
進入公開網站，依設定等待秒數、捲動或移動滑鼠到頁面上緣。
完成後會看到
彈窗會在設定的觸發時機出現。
- 4
這一步要做
點每個熱區與關閉按鈕。
完成後會看到
熱區會前往正確網址，關閉按鈕會收起彈窗。
注意事項
- • 「預覽彈窗」適合看外觀；無痕視窗才適合驗證觸發與頻率。
- • 測試外部連結前先確認網址安全且已上線。
遇到問題先看這裡
- 彈窗沒有出現？
- 檢查是否已啟用、目前是否符合觸發條件，以及瀏覽器是否因顯示頻率記錄而暫時不再顯示；可用無痕視窗重新測試。