使用行動呼籲 (CTA) 工具來建立按鈕 CTA、橫幅或彈出式視窗，以新增至您的 HubSpot 頁面並吸引新的訪客。您也可以新增 CTA 到外部頁面。
在外部頁面上新增 CTA 之前，您必須先安裝HubSpot 追蹤代碼，或在WordPress網站上安裝HubSpot WordPress 外掛程式。新增 CTA 之後，透過將訪客引導至特定頁面、會議連結或外部 URL 來驅動流量。
在行動裝置上，您可以在CTA 選項中選擇啟用回應式版面或在小螢幕上隱藏 CTA。發佈 CTA 之後，學習如何分析 CTA 的表現。
設計 CTA
在 CTA 編輯器中，自訂 CTA 的設計以吸引瀏覽者。在建立 CTA 時，您也可以使用智慧型內容，根據瀏覽者類別顯示不同版本的 CTA。進一步瞭解如何在 CTA 中使用智慧型內容。
- 在你的 HubSpot 帳戶中，瀏覽「行銷」>「行動呼籲」。
- 在右上方，按一下建立。
- 在頂端，選擇Pop-ups索引標籤或Embeds and Buttons索引標籤。
- 彈出式 CTA 將包括以下類型：
- 橫幅：固定在頁面頂部或底部的永久性橫幅。訪客捲動您的頁面時，橫幅會保持不變。
- 彈出方塊： 在設定的時間表中出現的彈出方塊。
- 滑入式：從網站一角滑入的橫幅。當瀏覽者捲動您的網頁時，橫幅會保持不變。
- 嵌入式和按鈕 CTA 包括以下類型：
- 嵌入式：您可在網站或 HubSpot 電子郵件中使用的橫幅、號召行動或按鈕，以將潛在客戶引導至特定頁面。
- 嵌入式圖片：您可以在 HubSpot 頁面或電子郵件上使用的圖片。
- 根據您要建立的 CTA 類型選擇範本。
- 每個 CTA 模版都會有可自訂的元素，例如圖片和文字欄位。
- 例如，您可以選擇「點選聊天 」範本來啟動 WhatsApp 連結，或選擇「活動」範本讓訪客註冊您的會議或工作坊。
- 在左側面板中，從「新增 」標籤，新增元素並編輯 CTA 的版面：
-
- 若要在 CTA 中加入更多內容，請點選並直接拖曳新元素到編輯器的右側面板。您也可以在 CTA 中加入視訊元素，進一步了解在 CTA 中加入視訊時的選項需求。
- 要修改 CTA 的佈局，請將滑鼠懸停在元素 上，然後按一下並將其拖曳到新的位置。
- 若要複製元素，請將滑鼠懸停在該元素上，然後按一下duplicateclone 圖示。
- 若要刪除元素，請將滑鼠懸停在該元素上，然後按一下delete刪除圖示。
-
- 若要編輯元素，請按一下該元素。
- 在左側面板中，您可以編輯元素的內容和設計。
- 要在訪客提交表單後關閉彈出 CTA，在自訂表單模組時，您可以切換開啟提交後關閉 開關。
- 在左側面板中，按一下內容 索引標籤以管理您的元素。
- 若要編輯元素，請按一下元素名稱 。在左側面板中，您可以編輯元素的內容和設計。在豐富的文字 元素中，您可以使用AI 助手 來建立或改進您的 CTA 內容。
- 若要刪除元素，請將滑鼠懸停在該元素上，然後按一下delete 刪除圖示。
- 在左側面板中，按一下「設計」標籤以自訂和預覽您的 CTA。
- 若要在特定頁面上預覽 CTA，請在右上方按一下預覽。然後按一下在特定頁面上預覽下拉式功能表，並選擇要預覽 CTA 的HubSpot 頁面。
-
- 若要自訂 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 會議連結。按一下Choose a meeting link（選擇會議連結）下拉選項，然後選擇會議 連結。若要在新頁面中開啟此連結，請選取「 在新標籤頁開啟連結」核取方塊。
- 您的其中一個頁面：將您的 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 刪除圖示。
- 若要對 CTA 應用與傳統 CTA 相同的 HTML 和類別，請選取使用傳統標記核取方塊。如果您在頁面上有為傳統 CTA 設定樣式的 CSS 樣式表，選擇此核取方塊將允許 HTML CTA 採用相同的樣式。
- 要完成 CTA 設計的設定，請按一下「儲存並套用」。
自訂黏貼橫幅、彈出框或滑入式 CTA 的顯示位置與時間
如果您已設定黏貼橫幅、彈出框或滑入式 CTA，請選擇希望此 CTA 在網站上顯示的時間，以鎖定訪客。進一步瞭解如何在頁面中加入 CTA。
您可以使用篩選器來組合多套規則，讓訪客看到您的 CTA。進一步瞭解如何設定您的定位規則。
啟動觸發器
選擇啟動觸發器，以決定 CTA 何時顯示在您的頁面上。一旦符合第一個選取的觸發條件，CTA 就會顯示。
- 在頂端，按一下「目標定位 」標籤。
- 在「何時顯示」區段中，按一下以切換您要使用的啟動觸發器旁的開關：
- 按鈕點選時觸發：CTA 會在訪客按下按鈕時顯示。瞭解如何設定您的彈出式 CTA 在按鈕點擊時觸發。預設情況下，此選項總是開啟。
- 在您的 HubSpot 頁面中設定預設按鈕模組，或在您的外部頁面中透過自訂按鈕類別來設定。
- 要在外部頁面上設定此觸發器，必須安裝HubSpot 追蹤代碼 。
- 頁面捲動觸發：當訪客捲動頁面過了指定的百分比時，CTA 就會出現。
- 退出時觸發：當訪客將游標移至瀏覽器視窗頂部的欄位時，CTA 將會出現。
- 經過時間後觸發： CTA 會在指定的秒數後出現。
- 不活動後觸發：CTA 會在訪客不活動指定秒數後顯示。
網站網址
在相同的「目標 」標籤中，針對特定網頁 URL 或查詢參數值新增條件邏輯。預設情況下，CTA 會顯示在所有頁面上。
- 若要在訪客瀏覽特定網站 URL 時顯示 CTA，請在網站 URL 區段中
- 按一下第一個下拉式功能表 ，然後選擇網站 URL。
- 按一下第二個下拉式功能表 ，然後選擇目標定位規則。
- 在文字欄位中輸入您的規則條件。
- 若要在訪客瀏覽 URL 包含特定查詢參數的網站頁面時顯示 CTA，請
- 按一下第一個下拉式功能表 ，然後選擇查詢參數。
- 在第一個文字欄位中輸入 查詢參數名稱。
- 按一下第二個下拉式功能表，然後選擇目標定位規則。
- 在第二個文字欄位中，輸入查詢參數值。
- 若要新增其他規則，請按一下新增規則。
- 若要從某些頁面排除行動呼叫，請按一下 新增排除規則。例如，您可能想要針對隱私權政策頁面新增排除規則。
-
- 選擇何時隱藏 CTA：
- 按一下新增排除規則。
- 按一下第一個下拉式功能表，選擇何時隱藏 CTA。
- 按一下下一個下拉式功能表，選擇您的過濾規則。
- 若要針對何時隱藏 CTA 新增更多規則，請按一下新增排除規則，然後選擇您的篩選規則。
-
- 若要建立另一組篩選規則，請按一下新增篩選群組 ，然後選擇您的篩選規則。
顯示頻率
在訪客首次移除您的黏貼式廣告橫幅、彈出框或滑入式 CTA 後，請選擇 CTA 應否再次顯示，以及顯示頻率。在「目標定位 」標籤中，設定 CTA 的顯示頻率：
- 在「多久顯示一次 」部分，按一下「再次顯示 」下拉式功能表並選擇頻率：
- 設定時間段：設定訪客捨棄 CTA 後，CTA 應該經過多少時間才會再次顯示。
- 即使開啟了跨網域追蹤，設定的頻率也不會跨網站子網域使用。
- 例如，如果訪客在blog.hubspot.com 上觸發並解除彈出式 CTA，但之後導航到knowledge.hubspot.com，即使設定的頻率尚未經過，相同的彈出式 CTA 仍會再次出现。在駁回彈出式 CTA 後，它只會在每個相應子域的設定頻率過後才會出現在該子域上。
-
- 重複：每次他們造訪選取的網頁並執行觸發的動作時，都會顯示 CTA，即使他們之前已經與 CTA 互動過。
- 不要再次顯示：只向訪客顯示 CTA 一次。初次顯示後，永遠不要再顯示 CTA。
- 即使開啟了跨網域追蹤，這一點也不適用於跨網站子域。
- 例如，如果訪客在blog.hubspot.com 上觸發並取消彈出式 CTA，但之後導航至knowledge.hubspot.com 上的頁面，則相同的彈出式 CTA 仍會顯示在該子域以及之前未顯示的任何其他子域。
請注意： 當使用按鈕點選觸發器 作為 啟動觸發器時，這並不適用於 CTA。
自訂您的 CTA 選項
在「選項 」標籤上，自訂不同的 CTA 選項，例如是否在小尺寸上顯示 CTA、任何相關的廣告系列，以及 CTA 的排程。
- 在頂部，按一下選項 索引標籤。
- 對於黏貼橫幅、彈出框或滑入式 CTA，您可以在小尺寸螢幕上隱藏 CTA。在「小螢幕尺寸」部分，選取「在小螢幕尺寸上關閉」核取方塊。
- 如果您訂閱了Marketing HubProfessional 或 Enterprise，就可以將 CTA 與活動相關聯：
- 若要將您的 CTA 與現有的廣告系列關聯，請按一下廣告系列下拉式功能表，然後選擇一個廣告系列。
- 若要將您的 CTA 與新的廣告系列關聯，請按一下廣告系列下拉式功能表，然後按一下建立廣告系列。然後繼續設定您的廣告系列。
-
- 設定追蹤 CTA 點擊的方式。從下列選項中選擇：
- 透過重定向追蹤點擊： 透過將瀏覽者導向初始 URL 來追蹤 CTA 的點擊，初始 URL 會將點擊與 CTA 相關聯，然後再將瀏覽者重定向至最終網頁。預設選取此選項。
- 透過瀏覽器追蹤點擊：透過訪客的瀏覽器以非同步方式追蹤點擊。此選項允許您使用錨標籤，因為沒有重定向，CTA 會將訪客引導至設定的 URL。
- 對於黏性橫幅、彈出框或滑入式 CTA，您可以排定 CTA 的顯示時間：
- 若要排定 CTA 開始顯示的時間，請切換Schedule for later開關。然後選擇開始日期和時間。
- 若要排定 CTA 停止顯示的時間，請切換「設定不發佈日期和時間 」開關。然後選擇結束日期 和時間。
發佈您的 CTA
完成 CTA 設定後，請發佈您的 CTA，使其生效。
- 在右上方，按一下「檢閱並發佈」。
- 在右側面板中，檢視您的 CTA，然後按一下立即發佈。CTA 將自動發佈到目標頁面。
CTAs
行銷 Hub
Starter
,
Professional
,
Enterprise
Content Hub
Starter
,
Professional
,
Enterprise