# 訊息推播 WebPush

**2025最新版本**

# 簡介

##### 訊息主動推播是數位行銷很重要的關鍵技術。  
  
之前大家都是串接LINE免費Notify訊息推播服務，2年多來也省下一筆大費用，但這一切要結束。  
  
  
2023~2025 總計發送免費的 Line Notify 訊息推播約5,000萬則

##### <span style="color: rgb(224, 62, 45);">**5000萬 x 0.2 省下 $1000萬**</span>  
  
  


![LINE Notify-inner.png](https://km.sopdom.com/uploads/images/gallery/2025-02/scaled-1680-/line-notify-inner.png)

#####   
  
  
  
早在面對這個事件, 我們團隊早在2024後半年, 就開始研究新一代網頁推播技術, 效果非常好跟app通知一樣的效果, 超融合團隊走出一條更遠更寬闊的路, 也是一次關鍵技術的大突破。  
  


![epower_webpush_i01.png](https://km.sopdom.com/uploads/images/gallery/2025-02/scaled-1680-/epower-webpush-i01.png)

#####  **升級新一代推播系統, 可大大提升品牌化**  


##### 可客製化3個LOGO圖示  
1. 通知小圖示  
2. 品牌Logo圖示  
3. 行銷推播大圖  
  
技術優勢  
1. 免安裝APP  
2. 使用Google網頁推播技術穩定可靠  
3. 整合LINE會員資料庫,可精準個人化推播

# 1. 基本設定

##### <span style="color: rgb(224, 62, 45);">開始使用新一代推播系統, 必須先完成 **基本設定** 才能使用!</span> **圖文選單的模組, 請選擇 推播系統 -&gt; 訊息中心  
  
  
設定步驟** 功能選單 -&gt; 播推系統 -&gt; 基本設定  
 **1. 推播方式**  
請選擇網站訂閱通知, 新一代推播技術  
<span style="color: rgb(224, 62, 45);">免費Notify通知 (官方3/31服務結束)</span>  



##### **2. APP應用名稱**  
建議3~5個字  


##### **3. APP LOGO圖片** 建議圖片大小 (512x512)  


##### **4. 訊息保留天數** 空白則不限制, 輸入30表示訊息發送後, 30天後自動下架  
  


[![notify_config_i02.png](https://km.sopdom.com/uploads/images/gallery/2025-02/scaled-1680-/notify-config-i02.png)](https://km.sopdom.com/uploads/images/gallery/2025-02/notify-config-i02.png)

# 2. 訊息管理

##### **新增步驟** 功能選單 -&gt; 推播系統 -&gt; 訊息管理  


##### 請點選左上角 -&gt; 操作 -&gt; 新增  
 **1. 訊息標題**  
輸入訊息的標題  



##### **2. 訊息簡介**  
輸入訊息的簡介  


##### **3. 完整內容** 輸入訊息的完整內容  


##### **4. 訊息按鈕名稱**  
非必填, 在訊息中新增一個按鈕名稱  


##### **5. 訊息活動連結**  
非必填, 輸入訊息按鈕的連結


![notify_admin_i01.png](https://km.sopdom.com/uploads/images/gallery/2025-02/scaled-1680-/notify-admin-i01.png)

##### **6. 訊息照片**  
播推訊息的照片, 大小響應式 建議&lt;1MB

##### **7. 訊息分類**  
可以規劃建立訊息的分類

##### **8. 排程日期**  
指定要發送的排程日期

##### **9. 排程時間**  
指定要發送的排程時間


##### **10. 目標會員分眾**  
要發送訊息的對象會員分眾

##### **11. 目標會員標籤** 要發送訊息的對象會員標籤

##### ![notify_admin_i02.png](https://km.sopdom.com/uploads/images/gallery/2025-02/scaled-1680-/notify-admin-i02.png)<span style="color: rgb(224, 62, 45);">  
  
  
訊息按鈕連結</span><span style="color: rgb(224, 62, 45);">，是提升推播的</span><span style="color: rgb(224, 62, 45);">轉換率，讓消費者看到滿意的商品，直接快速下單!</span><span style="color: rgb(224, 62, 45);">  
</span>

# 3. 訊息分類

##### **新增步驟** 功能選單 -&gt; 推播系統 -&gt; 訊息分類  


##### 請點選左上角 -&gt; 操作 -&gt; 新增  
 **1. 分類名稱**  
輸入分類名稱  



##### **2. 分類備註**  
輸入分類備註  


##### **3. 分類排序** 輸入分類的排序  


#####   


[![notify_categories_i01.png](https://km.sopdom.com/uploads/images/gallery/2025-02/scaled-1680-/notify-categories-i01.png)](https://km.sopdom.com/uploads/images/gallery/2025-02/notify-categories-i01.png)

# 4. 發送統計

#####   
當管理者發送訊息時, 會紀錄當時選擇的目標的分眾及標籤, 並統計當時的訂閱數, 讓管理者更直覺了解訂閱人數, 及發送訊息總數.

[![notify_log_i01.png](https://km.sopdom.com/uploads/images/gallery/2025-02/scaled-1680-/notify-log-i01.png)](https://km.sopdom.com/uploads/images/gallery/2025-02/notify-log-i01.png)

# 5. 訊息記錄

<span style="color: rgb(34, 34, 34); font-family: var(--font-heading, var(--font-body)); font-size: 1.4em; font-weight: 400;">每一筆的推播訊息稽核記錄, 包含訊息類別, 訊息標題, 訊息接收者, 已讀狀態, 已讀時間, 發送時間.</span>

#####   


[![notify_list_i01.png](https://km.sopdom.com/uploads/images/gallery/2025-02/scaled-1680-/notify-list-i01.png)](https://km.sopdom.com/uploads/images/gallery/2025-02/notify-list-i01.png)

# 6. Android手機如何訂閱通知?

##### ****加購訂閱推播模組才有這個功能****

#####   
  
[![epower_webpush_i01.png](https://km.sopdom.com/uploads/images/gallery/2025-02/scaled-1680-/epower-webpush-i01.png)](https://km.sopdom.com/uploads/images/gallery/2025-02/scaled-1680-/epower-webpush-i01.png)

#####   
  
  
<span style="color: rgb(224, 62, 45);">有兩個方式, 來提供會員訂閱通知服務</span>  
  
<span style="color: rgb(0, 0, 0); white-space: pre-wrap;">a. 進入會員專區, 有個 </span>****訊息通知**** <span style="color: rgb(0, 0, 0);">按鈕</span>  
<span style="color: rgb(0, 0, 0); white-space: pre-wrap;">b. 利用圖文選單, 推播系統 -&gt; </span>****訊息中心****

#####   
****1. 點選訊息通知****

##### 消費者還沒訂閱通知會提示說明  
  
  
![notify_oa_i01.jpg](https://km.sopdom.com/uploads/images/gallery/2025-02/scaled-1680-/notify-oa-i01.jpg)

#####   
****2. 訂閱步驟說明****

##### 系統會先判斷手機的系統, 給予不同的說明

![notify_oa_i02.jpg](https://km.sopdom.com/uploads/images/gallery/2025-02/scaled-1680-/notify-oa-i02.jpg)

##### ****3. 系統要求傳送訊息權限****

##### <span style="white-space: pre-wrap;">請選擇 </span>****允許****<span style="white-space: pre-wrap;"></span>

![notify_oa_i03.jpg](https://km.sopdom.com/uploads/images/gallery/2025-02/scaled-1680-/notify-oa-i03.jpg)

#####   
****4. 一鍵簡單訂閱通知完成****

##### 畫面如下, 自動回到官方LINE OA

[![notify-oa-i04-1.jpg](https://km.sopdom.com/uploads/images/gallery/2025-03/scaled-1680-/notify-oa-i04-1.jpg)](https://km.sopdom.com/uploads/images/gallery/2025-03/notify-oa-i04-1.jpg)

##### ****4. 後台可以查看會員訂閱狀態****  
可以得知那些會員已訂閱通知  
  
****5. 將大量訊息彙整視覺化****  
推播的所有訊息會整理到 ➔ 訊息通知 , 方便查看不被洗版, 便利的已讀未讀讓消費者快速吸收訊息  
  
****6. 將訊息通知數據化****  
後台也幫管理者, 分析訊息閱讀率, 統計那些消費者已讀或未讀數據分析

# 7. iOS手機如何訂閱通知?

##### <span style="color: rgb(224, 62, 45);">**iOS訂閱通知服務完整的步驟流程** </span>


![notify-ios-i01.jpg](https://km.sopdom.com/uploads/images/gallery/2025-03/scaled-1680-/notify-ios-i01.jpg)

##### **點選下面 <span style="color: rgb(224, 62, 45);">分享圖示icon</span>**

![notify-ios-i02.jpg](https://km.sopdom.com/uploads/images/gallery/2025-03/scaled-1680-/notify-ios-i02.jpg)

##### **<span style="color: rgb(224, 62, 45);">往下滑</span>**

![notify-ios-i03.jpg](https://km.sopdom.com/uploads/images/gallery/2025-03/scaled-1680-/notify-ios-i03.jpg)

##### <span style="color: rgb(224, 62, 45);">  
</span>

![notify-ios-i04.jpg](https://km.sopdom.com/uploads/images/gallery/2025-03/scaled-1680-/notify-ios-i04.jpg)

##### **加入主畫面, 按 <span style="color: rgb(224, 62, 45);">加入</span>**

![notify-ios-i05.jpg](https://km.sopdom.com/uploads/images/gallery/2025-03/scaled-1680-/notify-ios-i05.jpg)

#####  **推播系統, 記得要<span style="color: rgb(224, 62, 45);">允許</span>**

![notify-ios-i06.jpg](https://km.sopdom.com/uploads/images/gallery/2025-03/scaled-1680-/notify-ios-i06.jpg)


##### <span style="color: rgb(224, 62, 45);">**訂閱成功畫面, 圖片是有顏色, 不是灰色**</span>

![notify-ios-i07.jpg](https://km.sopdom.com/uploads/images/gallery/2025-03/scaled-1680-/notify-ios-i07.jpg)

##### <span style="color: rgb(224, 62, 45);">iOS手機收到推播訊息畫面, 主動彈出通知效果非常好</span>

[![epower_webpush_ios_i03.png](https://km.sopdom.com/uploads/images/gallery/2025-02/scaled-1680-/epower-webpush-ios-i03.png)](https://km.sopdom.com/uploads/images/gallery/2025-02/epower-webpush-ios-i03.png)

# 8. 如何吸引消費者訂閱通知?

##### <span style="color: rgb(224, 62, 45);">1. 贈送優惠券</span>

##### <span style="color: rgb(224, 62, 45);">2. 獲得點數</span>

##### <span style="color: rgb(224, 62, 45);">3. 提供價值內容</span>

##### <span style="color: rgb(224, 62, 45);">4. ..等等</span>

# 9. 如何發送推播訊息?

##### <span style="color: rgb(224, 62, 45);">終於突破 iOS 手機的推播技術, 太開心了, 也完美解決訊息品牌化的需求, 跨平台Android + iOS一站式超融合推播系統</span>

##### 登入超融合後台 -&gt; 功能選單 -&gt; 推播系統 -&gt; 訊息管理  
請點選左上角 -&gt; 操作 -&gt; 新增

##### 新增完成畫面, 等設定排程時間一到, 就會自動發送  
![epower-webpush-i01.png](https://km.sopdom.com/uploads/images/gallery/2025-03/scaled-1680-/epower-webpush-i01.png)

#####   
<span style="color: rgb(224, 62, 45);">在排程發送之前, 建議先發送測試訊息給自已看是否有需要修改優化訊息文案</span>

![epower-webpush-i02.png](https://km.sopdom.com/uploads/images/gallery/2025-03/scaled-1680-/epower-webpush-i02.png)

#####   
<span style="color: rgb(224, 62, 45);">消費者收到推播訊息, 主動推播是很重要的行銷核心功能</span>

![epower_webpush_i04.png](https://km.sopdom.com/uploads/images/gallery/2025-02/scaled-1680-/epower-webpush-i04.png)

##### <span style="color: rgb(224, 62, 45);">品牌化訊息推播, 可以客製化 icon/logo 圖示</span>

![epower-webpush-i05.jpg](https://km.sopdom.com/uploads/images/gallery/2025-03/scaled-1680-/epower-webpush-i05.jpg)

# 10. 會員沒收到推播訊息?

##### **<span style="color: rgb(224, 62, 45);">問題排除流程</span>**  
  


##### <span style="color: rgb(0, 0, 0);">1. 先進入超融合後台管理, 查看會員是否已完成通知訂閱, 如下圖</span>  
  
查看會員的訂閱通知欄位, 是否 <span style="color: rgb(224, 62, 45);">**打勾** </span>

![notify_fqq_a01.png](https://km.sopdom.com/uploads/images/gallery/2025-03/scaled-1680-/notify-fqq-a01.png)


#####   
<span style="color: rgb(224, 62, 45);"><span style="color: rgb(0, 0, 0);">2. 若是空白, 先請消費者截如下圖, 這張是成功訂閱通知的畫面</span>  
  
**若沒有與系統訂閱綁定成功是會灰色**</span>

![notify-fqq-a02-1.jpg](https://km.sopdom.com/uploads/images/gallery/2025-03/scaled-1680-/notify-fqq-a02-1.jpg)



##### <span style="color: rgb(224, 62, 45);">  
<span style="color: rgb(0, 0, 0);">3. 若還是找不出問題, 在如下圖的網址列, 前面有一個小icon點選</span>  
  
會出現如下圖, 請點選 **權限**</span>

[![notify-fqq-reset-i01.png](https://km.sopdom.com/uploads/images/gallery/2025-03/scaled-1680-/notify-fqq-reset-i01.png)](https://km.sopdom.com/uploads/images/gallery/2025-03/notify-fqq-reset-i01.png)

![notify-fqq-reset-i02.png](https://km.sopdom.com/uploads/images/gallery/2025-03/scaled-1680-/notify-fqq-reset-i02.png)

##### <span style="color: rgb(224, 62, 45);">會出現如下圖, 請點選 **重設權限** 再下拉刷新頁面重新訂閱通知</span>

![notify-fqq-reset-i03.png](https://km.sopdom.com/uploads/images/gallery/2025-03/scaled-1680-/notify-fqq-reset-i03.png)

# 11. 如何設定Android手機訊息彈出?

##### **<span style="color: rgb(224, 62, 45);">推播通知 -&gt; </span>**<span style="color: rgb(224, 62, 45);">**預設Android手機不會彈出訊息, 在頂端會出現通知小鈴鐺icon如下圖所示**  
  
  
</span>

![notify_android_i01.jpg](https://km.sopdom.com/uploads/images/gallery/2025-03/scaled-1680-/notify-android-i01.jpg)

#####   
下滑出現如下畫面, <span style="color: rgb(224, 62, 45);">**點選通知** </span>設定

![notify_android_i02.jpg](https://km.sopdom.com/uploads/images/gallery/2025-03/scaled-1680-/notify-android-i02.jpg)

##### 應用程式通知 -&gt; <span style="color: rgb(224, 62, 45);">**Chrome**</span>

![notify_android_i03.jpg](https://km.sopdom.com/uploads/images/gallery/2025-03/scaled-1680-/notify-android-i03.jpg)

##### <span style="color: rgb(224, 62, 45);">**開啟彈出視窗功能**</span>

![notify_android_i04.jpg](https://km.sopdom.com/uploads/images/gallery/2025-03/scaled-1680-/notify-android-i04.jpg)



##### <span style="color: rgb(224, 62, 45);">**彈出效果如下**</span>

![notify_android_i05.jpg](https://km.sopdom.com/uploads/images/gallery/2025-03/scaled-1680-/notify-android-i05.jpg)