如何建立訂閱表格？

訂閱表格 更新日期 19 三月, 2021

在網站或社群媒體平台使用訂閱表格是收集訂閱用戶的一個好方法。您可以在 Benchmark Email 帳戶建立不同訂閱表格，本文將帶您實際操作，了解如合建立每一種訂閱表格。

點擊下方選項，了解您要建立的訂閱表格。

• 內嵌式訂閱表格（進階）
• 內嵌式訂閱表格
• 水平排列內嵌式訂閱表格
• 彈出式訂閱表格
• 已訂閱用戶還會看到彈出式訂閱表格嗎？
• 一般式訂閱表格
• 符合 GDPR 規定的訂閱表格

開始前，請注意下列事項：

• 免費帳戶每天可以收集 75 個訂閱用戶。
• 付費帳戶沒有限制訂閱用戶的數量。
• 使用舊介面的客戶無法使用內嵌式訂閱表格（進階）。
• 新介面已經用新的「內嵌式訂閱表格（進階）」取代原本的「一般式訂閱表格」，功能維持相同。
• 顧名思義，內嵌式訂閱表格就是嵌在網站裡面，跟其他內容或區塊放在網站上。
• 如果您要刪除訂閱表格的某個區塊，進到訂閱表格編輯器，將滑鼠移到區塊上方，您會看到垃圾桶圖示。點擊該圖示，刪除該區塊。
• 截至 2018 年 9 月，許多 Google 服務仍被中國封鎖。由於這些限制，如果您位於中國等受到影響的地區，reCAPTCHA 驗證碼可能無法正常運作。點擊此處，了解更多相關資訊。
• Javascript 訂閱表格（含網站追蹤）：更改或更新 Javascript 訂閱表格的內容會直接顯示在您的網站。
• HTML 訂閱表格（含網站追蹤）：更改或更新 HTML 訂閱表格的內容不會自動顯示在您的網站。要看到更新後內容，您需要再次儲存並發布訂閱表格，複製新的 HTML 代碼，最後貼到您的網站。

 

內嵌式訂閱表格（進階）

建立訂閱表格步驟如下：

1. 點擊導覽列左側的「聯絡人」。
2. 現在，點擊導覽列左側選單的「訂閱表格」。
3. 然後，點擊頁面右上方的「新增訂閱表格」按鈕。
4. 選擇「內嵌式訂閱表格（進階）」，點擊「下一步」。
5. 替訂閱表格命名並選擇聯絡人名單，然後點擊「儲存及下一步」。
6. 建立並編輯您的訂閱表格
   • 點擊左上方的「訂閱設定」，編輯訂閱設定訊息。
   • 將滑鼠移動到訂閱表格上方，點擊「刪節號」就可以變更訂閱表格外觀或新增欄位。
7. 完成後，點擊「儲存並發布」。
8. 接著你會看到訂閱表格代碼，選擇您要的代碼類型，像是 Javascript 或 HTML，複製並貼上到您的網站。

重要

• 如果您沒有設定像素的寬度，訂閱表格會填滿整個寬度區域。
• 訂閱表格在桌機顯示最大寬度為 999 像素，但如果在行動裝置開啟，訂閱表格會自動填滿與螢幕大小一致。

可自訂義的部份

• 雖然您可以自訂寬度，但是我們不建議您做調整。訂閱表格預設會以 100% 大小填滿整個寬度區域。
• 您可以更改訂閱表格的背景顏色、新增框線以及設定圓角。
• 點擊訂閱表格，新增圖片、文字、分隔線，自訂標題、欄位以及訂閱表格按鈕。
• 您可以在內嵌式訂閱表格（進階）加入想要的欄位數量，但我們建議保持訂閱表格精簡。

需要靈感嗎？下面是透過 Benchmark 建立的訂閱表格。

返回頁首

 

內嵌式訂閱表格

開始前，請注意下列事項：

• 訂閱表格寬度取決於您放在網站的位置。
• 內嵌式訂閱表格只收集電子信箱、名字以及姓氏。

建立內嵌式訂閱表格步驟如下：

1. 登入您的 Benchmark 帳戶。
2. 點擊左側導覽列的「連路人」。
3. 現在，點擊導覽列左側選單的「訂閱表格」。
4. 點擊頁面右上方的「新增訂閱表格」按鈕。
5. 選擇「內嵌式訂閱表格」，點擊「下一步」。
6. 替訂閱表格命名並選擇聯絡人名單。
7. 點擊「儲存及下一步」。
8. 建立並編輯您的訂閱表格。

完成後，點擊「儲存並發布」。系統會彈出訂閱表格代碼視窗，選擇 Javascript 或 HTML 代碼，複製並貼上到您的網站。

可以自訂義的設定

這款精簡的訂閱表格只有三個欄位，名字、姓氏以及電子信箱，但不支援圖片。

• 雖然您可以自訂寬度，但是我們不建議您做調整。訂閱表格預設為 100% 填滿整個區域。
• 您可以更改背景顏色、標題以及按鈕樣式。

需要靈感嗎？下面是透過 Benchmark 建立的訂閱表格。

 

返回頁首

如何設定水平排列的內嵌式訂閱表格

內嵌式訂閱表格只有三個欄位，名字、姓氏以及電子信箱。這是為什麼我們會建議您修改內嵌式訂閱表格的原因，並且維持至少兩個欄位。如果需要姓氏欄位，而且網站設計能夠兼容，您可以啟用這組欄位。

參考下列步驟，設定水平排列的內嵌式訂閱表格。

從訂閱表格工具內設定

要建立水平排列的訂閱表格，您需要有一個已建立的內嵌式訂閱表格。

1. 完成訂閱表格後，點擊「儲存並發布」。

2. 點擊彈出式視窗的「確認」變更，點擊下拉式視窗，選擇 HTML 代碼。
3. 點擊「複製」選項。複製選項會選取整個代碼。

4. 關閉彈出式視窗，點擊左上角 Benchmark 商標，返回 Benchmark 首頁。

接下來在代碼編輯器繼續操作，這部份非強制性，您也可以使用文字檔案。

1. 現在，進到「電子郵件」導覽列。
2. 點擊「建立新電子郵件」按鈕，然後選擇「一般電子報」。
3. 點擊「建立新電子郵件」按鈕，然後選擇「一般電子報」。

4. 命名郵件。這封郵件只是用來測試，不是真的要發送。編輯完後，我們建議您刪除郵件或是不要動它，因為代碼可能會變動。
5. 不用完成檢查列表的內容，直接進入「郵件設計」選項。

6. 使用先前在內嵌式訂閱表格複製的 HTML 代碼，替換在左邊代碼編輯器現有的文字。您可以在右邊看到您的訂閱表格。

不用擔心現在看到的郵件頁尾。最後複製代碼的時候就不會顯示了。

7. 現在，使用鍵盤搜尋欄位。如果您用 Mac，按下 cmd+f ，使用 Windows  系統，按下 ctrl+f。

這是我們實際搜尋操作的範例：

8. 在搜尋欄位輸入 fieldset 或欄位名稱（舉例：名字）。如果搜尋 fieldset，您會找到多筆 fieldset，但我們要找的是這個：

<fieldset class=”formbox-field 

第一個 fieldset 且後面接著 class=  

因為有欄位名稱，所以您可以辨識出來。查看上面圖片，欄位名稱用藍色標注。

9. 現在我們可以編輯。在 <fieldset> 標籤前面，您可以加入下列標籤（可以複製貼上）：

<table><tr><td>

10. 完成後，您必須在欄位結尾處新增關閉標籤：

</td>

找到結尾標籤為 </fieldset> 的欄位。

11. 前往下一個欄位，新增下列標籤：

 <td> 

12. 如果您還有一組欄位（姓氏欄位），在開頭新增 <td> 標籤，結尾新增 </td> 標籤。
13. 在最後一個欄位結尾新增：

 </td></tr></table>

14. 您會看到訂閱表格水平排列，最後要刪除寬度。
15. 再次打開搜尋欄，尋找寬度，我們要找的是這個：

width: 320px; 

找到後，將它從代碼中刪除，不要刪除其他內容。

代碼最後呈現的樣子如下：

注意，我們用藍色標示新增的標籤。此外，寬度已經移除，所以您可以看到水平排列的訂閱表格。

16. 訂閱表格設定完成！複製整個代碼，貼到您的網站。

如果您需要影片協助，請依照下面影片裡的代碼編輯器步驟：

 

 

返回頁首

彈出式訂閱表格

訪客瀏覽網頁時會彈出這款訂閱表格，覆蓋在頁面上方，使網頁顏色變暗。

建立彈出式訂閱表格步驟如下：

1. 點擊導覽列左側的「聯絡人」。
2. 現在，點擊導覽列左側選單的「訂閱表格」。
3. 然後，點擊頁面右上方的「新增訂閱表格」按鈕。
4. 選擇「彈出式訂閱表格」，點擊「下一步」。
5. 替訂閱表格命名並選擇聯絡人名單。
6. 點擊「儲存及下一步」。
7. 建立並編輯您的訂閱表格。
   • • 點擊左上方的「訂閱設定」，編輯訂閱設定訊息。
     • 點擊「全局設定」，編輯彈出式表格設定。
8. 完成後，點擊「儲存並發布」。

請注意下列事項：

• 彈出式訂閱表格寬度預設為 400 像素，左右兩邊的間距是 40 像素。圖片最大寬度為 320 像素。如果圖片佔滿整個頁面寬度，您可以根據需求修改圖片。

可以自訂義的設定

除了彈出式訂閱表格本身，您還可以自訂其他內容，像是「訂閱成功」訊息。記住，彈出式訂閱表格是訪客瀏覽網頁才彈出來，雖然您可以新增多組欄位，但我們建議您欄位保持精簡才能快速收集更多訂閱用戶。

• 您可以選擇「彈窗位置」，也就是表格在頁面出現的地方：「置中」為常見選項。
• 您可以設定新的寬度。
• 您可以新增「動畫」！訂閱表格可以選擇從向左或向右滑動、上升或下降，展開或淡入。
• 「延遲」表示訂閱表格出現的時間，可以選擇 0 到 60 秒。
• 類似其他訂閱表格，您也可以自訂顏色、框線、圓角，也可以增加陰影、選擇不透明度及陰影大小。
• 訪客如果不想訂閱可以關閉訂閱表格。您還可以自訂「關閉」圖示的位置、顏色、圖示類型、背景及框線等等。
• 「覆蓋」預設為不透明度 70% 的黑色，它是訂閱表格顯示時的背景，您可以自訂顏色、不透明度，如果不需要還可以取消套用。我們建議您保留覆蓋設定，增加訂閱表格的視覺效果。
• 點擊訂閱表格，新增圖片、文字、分隔線，自訂標題、欄位以及訂閱表格按鈕。
• 點擊「訂閱成功」，自訂義訊息內容。您也可以更改字型、顏色樣式、文字以及背景。

需要靈感嗎？下面是透過 Benchmark 建立的訂閱表格。

返回頁首

 

已訂閱用戶還會看到彈出式訂閱表格嗎？

彈出式訂閱表格預設只會針對未訂閱用戶顯示一次。一旦訪客訂閱後，頁面就不會再彈出訂閱表格。如果回流訪客清除瀏覽器快取資料、使用無痕模式或使用其他瀏覽器，彈出式訂閱表格就會再出現。

如何讓彈出式訂閱表格只彈出一次？

1. 在設計步驟，點擊「全局設定」。
2. 然後，點擊「關閉」選項。
3. 現在，選擇「訪客只會看到一次彈出式視窗」選項。
4. 最後，點擊「儲存並發布」。

如果訂閱表格安裝在許多頁面上，訂閱表格一樣只會彈出一次。

 

返回頁首

 

 

一般式訂閱表格

請注意下列事項：

• 一般式訂閱表格格式比較舊，類似內嵌式，但一般式訂閱表格格式已經過時。  
• 我們已經用「內嵌式訂閱表格」取代「一般式訂閱表格」。
• 您可以複製一般式訂閱表格，但無法建立全新的一般式訂閱表格。
• 只有使用舊介面的用戶可以使用「一般式訂閱表格」。

返回頁首

 

如何建立符合 GDPR 規定的訂閱表格

新增符合 GDPR 規定的核取方塊總共有兩個步驟，請參考下列說明。

• 編輯聯絡人名單的自訂欄位。
• 在訂閱表格新增核取方塊。

聯絡人名單的自訂欄位

1. 建立一組聯絡人名單，連動到訂閱表格。
2. 建立名單後，點擊編輯。
3. 您會看到名單內的所有欄位，將橫軸移動到「自訂欄位」，選擇一組欄位進行編輯。您可以將欄位重新命名，像是「隱私權政策」。
4. 更改欄位類型為是/否，目的是紀錄訪客填寫訂閱表格的答案。

 

欄位編輯完成後，我們需要建立符合 GDPR 規定的訂閱表格。

在訂閱比格新增核取方塊

您可以在「內嵌式訂閱表格」或「彈出式訂閱表格」使用核取方塊。

1. 建立一組訂閱表格（也可以使用已建立的表格）。
2. 接著，選擇先前編輯過欄位的聯絡人名單。在建立訂閱表格的步驟 2 新增前一個步驟編輯過的欄位。
3. 滑鼠移動到名字和電子信箱的中間，點擊刪除號並新增您要的欄位。
4. 然後「選擇欄位」，勾選您建立的自訂欄位。
5. 現在，點擊返回箭頭，您會看到剛才選擇的欄位。
6. 點擊該欄位。
7. 替欄位命名，像是改成「隱私權政策」。（非強制，因為您已經在聯絡人名單內修改過欄位名稱）。
8. 更改類型為「核取方塊」。
9. 勾選「必填」方塊。
10. 在答案欄位，新增下列代碼<a target=”blank” href=”https://www.yourdomain.com“><u>隱私權政策</u></a> 注意：將 https://www.yourdomain.com 替換成貴公司網站的隱私權政策頁面。

繼續編輯訂閱表格，或是完成後，點擊「儲存並發布」。

重要

• 上面第 10 點提到的超連結必須連結到您網站的隱私權政策。
• 內嵌式訂閱表格不支援核取方塊，所以無法建立訂閱表格。

您也可以參考下面影片，了解更多資訊：

• 內嵌式訂閱表格（進階）：僅限新介面才能使用

 

返回頁首

重要

如果熟悉 CSS，您可以加入代碼，幫訂閱表格增添額外的風格。

如果您有其他問題，請隨時透過電子郵件、線上客服或電話與我們的支援團隊聯絡。

---

有回答到您的問題嗎？