跳到內容
請注意::這篇文章的翻譯只是為了方便而提供。譯文透過翻譯軟體自動建立,可能沒有經過校對。因此,這篇文章的英文版本應該是包含最新資訊的管理版本。你可以在這裡存取這些內容。

建立號召性用語 (CTA)

上次更新時間: 十二月 2, 2024

可与下列任何一种订阅一起使用,除非有说明:

行銷 Hub   Starter , Professional , Enterprise
Content Hub   Starter , Professional , Enterprise

使用號召性用語 (CTA) 工具建立按鈕 CTA、橫幅或彈出窗口,以新增至您的 HubSpot 頁面並吸引新訪客。您也可以將 CTA 新增至外部頁面。

在將 CTA 新增至外部頁面之前,您必須安裝HubSpot 追蹤程式碼,或在您的 WordPress 網站上安裝HubSpot WordPress 外掛程式。新增 CTA 後,透過將訪客引導至特定頁面、會議連結或外部 URL 來增加流量。

在行動裝置上,您可以在CTA 選項中選擇啟用響應式佈局或隱藏小螢幕上的 CTA。發布 CTA 後,了解如何分析 CTA 的效果

設計號召性用語

在 CTA 編輯器中,自訂 CTA 的設計以吸引訪客。建立 CTA 時,您也可以使用智慧內容根據觀眾類別顯示不同版本的 CTA。詳細了解如何在 CTA 中使用智慧內容

  • 點選右上角的「建立」
  • 在頂部,選擇彈出視窗標籤或嵌入和按鈕標籤。
    • 彈出式 CTA 將包括以下類型:
      • 橫幅:固定在頁面頂部或底部的永久橫幅。當訪客滾動瀏覽您的頁面時,橫幅將保留。
      • 彈出框:依照設定的時間表出現的彈出框。
      • 滑入式:從網站角落滑入的橫幅。當訪客滾動瀏覽您的頁面時,橫幅將保留。
    • 嵌入和按鈕 CTA 將包括以下類型:
      • 嵌入:您可以在網站或 HubSpot 電子郵件上使用的橫幅、號召性用語或按鈕,以吸引潛在客戶造訪特定頁面。
      • 嵌入圖片:您可以在 HubSpot 頁面或電子郵件上使用的圖片。
  • 根據您要建立的 CTA 類型選擇模板
    • 每個 CTA 模板都將具有可自訂的元素,例如圖像和文字欄位。
    • 例如,您可以選擇「點擊聊天」範本來啟動 WhatsApp 鏈接,或選擇「活動」範本供訪客註冊參加您的會議或研討會。
  • 在左側面板的「新增」標籤中,新增元素並編輯 CTA 的佈局:
    • 若要為 CTA 新增更多內容,請按一下新元素並將其直接拖曳到編輯器的右側面板中。您也可以將影片元素新增至 CTA,以詳細了解將影片新增至 CTA時的要求選項。
    • 若要修改 CTA 的佈局,請將滑鼠懸停在某個元素上,然後按一下並將其拖曳到新位置。
    • 若要複製該元素,請將滑鼠懸停在該元素上並按一下duplicate克隆圖示
    • 若要刪除元素,請將滑鼠懸停在元素上並按一下delete刪除圖示
    • 若要編輯元素,請按一下該元素。在左側面板中,您可以編輯元素的內容和設計。
 

KB - CTA update 

  • 在左側面板中,按一下「內容」標籤來管理您的元素。
    • 若要編輯元素,請按一下元素的名稱。在左側面板中,您可以編輯元素的內容和設計。在富文本元素中,您可以使用AI助手創建或完善您的 CTA 內容。
    • 若要刪除元素,請將滑鼠懸停在該元素上並按一下delete圖示
  • 在左側面板中,按一下「設計」標籤來自訂和預覽 CTA。
    • 若要在特定頁面上預覽 CTA,請點選右上角的「預覽」 。然後,點擊「在特定頁面上預覽」下拉式選單並選擇HubSpot 頁面以預覽 CTA。
    • 若要自訂 CTA 的外觀,請選擇以下選項之一。然後,在左側面板中配置您的變更。
      • 位置:對於黏性橫幅 CTA,您可以選擇頂部或底部位置。對於滑入式 CTA,您可以將 CTA 放置在頁面的左上角、左下角、右上角或右下角。
      • 尺寸:配置 CTA 的高度,您可以開啟該選項以根據 CTA 的內容自動設定高度。
      • 佈局:配置 CTA 的佈局。您可以為 CTA 內容新增填充。您也可以開啟該選項以啟用響應式佈局。透過響應式佈局,CTA 的列將在小螢幕上垂直堆疊。
      • 樣式:設定 CTA 的樣式,例如 CTA 的主要字體、邊框和陰影。您可以在 CTA 中使用自訂字體,以了解有關在 HubSpot 內容中使用自訂字體的更多資訊。
      • 背景:為CTA設定背景,您可以選擇設定背景顏色或上傳背景圖片。
      • 關閉選項:對於彈出框 CTA,您可以開啟該選項,以允許訪客在點擊彈出框之外的任意位置時關閉 CTA。關閉此選項後,訪客只能使用關閉圖示關閉 CTA。

設計 HTML CTA

若要建立自訂嵌入式 HTML CTA 並套用自訂主題或 CSS:

  • 在左側面板中,按一下「從頭開始」
  • 然後,按一下展開進階選項並選擇嵌入 HTML
  • 點擊「連結到」下拉式選單,然後選擇 CTA 重定向到的選項:
    • 電子郵件地址:建立 mailto 連結。要在新頁面中開啟此鏈接,請選取在新分頁中開啟連結複選框。
    • 檔案下載:將 CTA 連結到檔案總管中的檔案。如果您希望點擊按鈕 CTA 的訪客在新的瀏覽器視窗中查看圖像,請選擇現有文件或上傳新文件,然後選擇「在新分頁中開啟連結」複選框。
    • 會議連結:將您的 CTA 連結到 HubSpot 會議連結。點擊選擇會議連結下拉列表,然後選擇會議連結。要在新頁面中開啟此鏈接,請選取在新分頁中開啟連結複選框。
    • 您的頁面之一:將您的 CTA 連結到您的 HubSpot 頁面或部落格文章之一。點擊頁面下拉選單,然後選擇頁面或貼。按鈕 CTA 的連結將與頁面 ID 綁定,頁面 URL 的任何變更都會自動更新按鈕 CTA 的連結。要在新頁面中開啟此鏈接,請選取在新分頁中開啟連結複選框。
    • URL:將您的 CTA 連結到 HubSpot 以外的外部頁面。在連結 URL欄位中,輸入您想要引導訪客造訪的網站 URL 。要在新頁面中開啟此鏈接,請選取在新分頁中開啟連結複選框。
    • CTA:使用自訂 CTA 來觸發黏性橫幅、彈出框或滑入式 CTA。
  • 按鈕內容欄位中,輸入CTA 文字
  • 若要進一步自訂 CTA 的設計,請按一下“進階”

 

  • 「進階」頁面上,您可以新增自訂 CSS 類別或規則:
    • 自訂 CSS 類別:在 CTA 中輸入自訂類別。使用自訂類別在網站的多個 CTA 中套用設計風格,例如字體系列。任何自訂 CSS 類別都應包含在 HubSpot 頁面中使用的 CSS 樣式表中。
    • 自訂 CSS 規則:新增自訂規則以套用特定於您的 CTA 的內嵌樣式。
      • 若要新增新的 CSS 規則,請按一下新增一個+ 新增 配置您的選擇器和樣式。
        • 選擇器:輸入 CSS 選擇器。該值是可選的,將與 CTA 的選擇器結合使用。例如,如果輸入的選擇器是:hover ,則組合選擇器將變成${ctaSelector}:hover
        • 樣式:輸入自訂 CSS 樣式規則以套用於配置的選擇器。您可以輸入樣式而無需輸入選擇器。例如color: yellow;

  • 若要編輯現有 CSS 規則,請將滑鼠懸停在該規則上並按一下edit圖示
  • 若要複製 CSS 規則,請將滑鼠懸停在該規則上並按一下duplicate複製圖示
  • 若要管理 CSS 規則的優先級,請按一下並拖曳每個規則以按優先順序排列。
  • 若要刪除 CSS 規則,請將滑鼠懸停在該規則上並按一下delete圖示
  • 若要將相同的 HTML 和類別套用到 CTA 作為舊版 CTA,請選取「使用舊版標記」複選框。如果您在設計舊 CTA 的頁面上有 CSS 樣式表,則選取此核取方塊將允許 HTML CTA 採用相同的樣式。
  • 若要完成 CTA 設計的設置,請按一下「儲存並套用」。
     

 

自訂黏性橫幅、彈出框或滑入式 CTA 的顯示位置和時間

如果您設定了黏性橫幅、彈出框或滑入式 CTA,請透過選擇您希望此 CTA 出現在網站上的時間來定位訪客。詳細了解如何將號召性用語加入您的網頁

您可以使用篩選器來組合多組關於哪些訪客可以看到您的 CTA 的規則。了解有關配置定位規則的更多資訊。

啟動觸發器

選擇啟動觸發器以確定 CTA 何時顯示在您的頁面上。一旦滿足第一個選定的觸發條件,CTA 就會出現。

  • 點擊頂部的“定位”標籤。
  • 「何時應該顯示」部分中,按一下以切換要使用的啟動觸發器旁的開關
    • 單擊按鈕時觸發:當訪客單擊按鈕時,CTA 將出現。了解如何設定彈出式 CTA 以在點擊按鈕時觸發。預設情況下,此選項始終開啟。
      • 在具有預設按鈕模組的 HubSpot 頁面中或透過自訂按鈕的類別在外部頁面上配置此功能。
      • 若要在外部頁面上設定此觸發器,必須安裝HubSpot 追蹤程式碼
    • 頁面捲動觸發:當訪客捲動超過頁面的指定百分比時,CTA 將出現。
    • 退出意圖觸發:當訪客將遊標移至瀏覽器視窗的頂部欄時,CTA 將出現。
    • 經過一段時間後觸發: CTA 將在指定的秒數後出現。
    • 不活動後觸發: CTA 將在訪客處於不活動狀態指定的秒數後出現。

網站網址

在相同目標標籤中為特定網頁 URL 或查詢參數值新增條件邏輯。預設情況下,CTA 將出現在所有頁面上。

  • 若要在訪客造訪特定網站 URL 時顯示 CTA,請在「網站 URL」部分中
    • 點擊第一個下拉式選單並選擇Website URL
    • 點擊第二個下拉式選單並選擇定位規則
    • 在文字欄位中輸入您的規則標準
  • 若要在訪客造訪 URL 包含特定查詢參數的網站頁面時顯示 CTA:
    • 點擊第一個下拉式選單並選擇查詢參數。
    • 在第一個文字欄位中,輸入查詢參數名稱
    • 點擊第二個下拉式選單並選擇定位規則
    • 在第二個文字欄位中,輸入查詢參數值
  • 若要新增其他規則,請按一下「新增規則」
  • 若要從某些頁面中排除號召性用語,請按一下新增排除規則。例如,您可能想要新增隱私權策略頁面的排除項。

訪客資訊和行為

您也可以根據「目標」標籤中已知的訪客資訊和行為來定位特定聯絡人。您可以新增的過濾規則類型取決於您帳戶的訂閱。

  • 若要向指定網站上的所有訪客顯示 CTA,請選擇「所有訪客」 。預設選擇此選項。
  • 若要向特定訪客顯示 CTA,請按一下「篩選的訪客」選項。然後,設定您的濾鏡:
    • 點擊第一個下拉式選單選擇如何過濾訪客。
    • 點擊下一個下拉式選單以選擇您的過濾規則
    • 若要新增更多關於何時顯示 CTA 的規則,請點選「新增規則」並選擇您的篩選器。
    • 選擇何時隱藏 CTA:
      • 按一下新增排除規則
      • 點擊第一個下拉式選單以選擇何時應隱藏 CTA。
      • 點擊下一個下拉式選單以選擇您的過濾規則
      • 若要新增更多關於何時隱藏 CTA 的規則,請按一下「新增排除規則」並選擇您的篩選器。
    • 若要建立另一組過濾規則,請按一下「新增篩選器組」並選擇您的篩選規則。



顯示頻率

訪客首次關閉您的黏性橫幅、彈出框或滑入式 CTA 後,選擇是否應再次顯示 CTA 以及顯示頻率。在「定位」標籤中,設定 CTA 的顯示頻率:

  • “顯示頻率”部分中,按一下“如何再次顯示下拉式選單並選擇頻率:
    • 在設定的時間段後:設定訪客取消 CTA 後、再次顯示 CTA 之前應經過的時間。
    • 重複:每次使用者造訪所選網頁並執行觸發操作時都會顯示號召性用語,即使他們之前已與之互動過。
    • 不再顯示:僅向訪客顯示一次號召性用語。首次顯示後,切勿再次顯示 CTA。

請注意:當使用按鈕點擊觸發作為 CTA 時,這不適用於 CTA 啟動觸發器。


自訂您的 CTA 選項

在「選項」標籤上,自訂不同的 CTA 選項,例如是否以小尺寸顯示 CTA、任何關聯的廣告活動以及 CTA 的計劃。

  • 點擊頂部的“選項”標籤。
  • 對於黏性橫幅、彈出框或滑入式 CTA,您可以在小螢幕尺寸上隱藏 CTA。在“小螢幕尺寸”部分中,選取“在小螢幕尺寸上關閉”複選框。
  • 如果您擁有Marketing Hub ProfessionalEnterprise訂閱,則可以將 CTA 與行銷活動相關聯:
    • 若要將您的 CTA 與現有行銷活動相關聯,請點擊「行銷活動」下拉式選單並選擇一個行銷活動
    • 若要將您的 CTA 與新行銷活動相關聯,請按一下「行銷活動」下拉式選單,然後按一下「建立行銷活動」 。然後,繼續設定您的廣告活動
  • 配置您希望如何使用 CTA 追蹤點擊次數。從以下選項中選擇:
    • 透過重新導向追蹤點擊:透過將訪客引導至初始 URL(該 URL 將點擊與 CTA 相關聯),然後將其重新導向到最終頁面,來追蹤對 CTA 的點擊。預設選擇此選項。
    • 透過瀏覽器追蹤點擊:透過訪客的瀏覽器非同步追蹤點擊。此選項可讓您使用錨標記,因為沒有重新導向,CTA 會將訪客引導至設定的 URL。
  • 對於黏性橫幅、彈出框或滑入式 CTA,您可以安排 CTA 顯示的時間:
    • 若要安排 CTA 開始顯示的時間,請開啟「安排稍後」開關。然後,選擇開始日期時間
    • 若要安排 CTA 停止顯示的時間,請開啟「設定取消發布日期和時間」開關。然後,選擇結束日期時間


發佈您的號召性用語

設定完 CTA 後,發布 CTA 使其生效。

  • 在右上角,按一下「審閱並發布」
  • 在右側面板中,查看您的 CTA,然後點擊「立即發布」 。 CTA 將自動發佈到目標頁面。
這篇文章有幫助嗎?
此表單僅供記載意見回饋。了解如何取得 HubSpot 的協助