建立行動號召(CTA)
上次更新時間: 九月 2, 2024
可与下列任何一种订阅一起使用,除非有说明:
行銷 Hub Starter , Professional , Enterprise |
Content Hub Starter , Professional , Enterprise |
使用行動號召(CTA)工具建立按鈕行動號召、橫幅或彈出式視窗,以新增至HubSpot頁面並吸引新訪客。 你也可以將行動呼籲新增至外部頁面。
在將CTA新增至外部頁面之前,你必須安裝HubSpot追蹤程式碼,或在WordPress網站上安裝HubSpot WordPress外掛程式。 新增行動呼籲後,引導訪客前往特定頁面、會議連結或外部網址,藉此提高流量。
在行動裝置上,你可以選擇啟用回應式佈局,或在「行動呼籲」選項的小螢幕上隱藏行動呼籲。 發佈行動呼籲後,了解如何分析行動呼籲的表現。
設計行動呼籲
在行動呼籲編輯器中,自訂行動呼籲的設計以吸引訪客。
- 在你的 HubSpot 帳戶中,瀏覽「行銷」>「行動呼籲」。
- 點擊右上角的「建立」。
- 您可以從頭開始或從範本中建立新的行動呼籲:
- 若要從範本建立新的行動呼籲,請在左側面板中按一下HubSpot範本。 然後,選擇與您的目標相符的範本。
- 若要從頭開始建立新的行動呼籲,請在左側面板中按一下「從頭開始」。 然後,選擇行動呼籲類型:
- 置頂橫幅:固定在頁面頂部或底部的永久橫幅。 訪客捲動頁面時,橫幅仍會保留。
- 彈出式方塊:在設定時間表上出現的彈出式方塊。
- 滑入:從網站角落滑入的橫幅。 訪客捲動頁面時,橫幅仍會保留。
- 嵌入式:您可以在網站或HubSpot電子郵件中使用的橫幅、行動呼籲或按鈕,以吸引潛在客戶前往特定頁面。
- 內嵌圖片:您可以在HubSpot頁面或電子郵件中使用的圖片。
- 在左側面板的「新增」索引標籤中,新增元素並編輯行動呼籲的版面配置:
-
- 若要為行動呼籲新增更多內容,請點擊並將新元素直接拖曳到編輯器的右側面板中。 你也可以在行動呼籲中新增影片元素,進一步了解在行動呼籲中新增影片時的選項要求。
- 若要修改行動呼籲的版面配置,請將滑鼠遊標懸停在元素上,然後按一下並將其拖曳到新位置。
- 若要複製元素,請將滑鼠遊標懸停在元素上,然後按一下duplicate製複製圖示。
- 若要刪除元素,請將遊標暫留於元素上,然後按一下delete刪除圖示。
- 若要編輯元素,請按一下該元素。 在左側面板中,您可以編輯元素的內容和設計。
- 在左側面板中,按一下「內容」索引標籤以管理元素。
- 若要編輯元素,請按一下元素的名稱 。 在左側面板中,您可以編輯元素的內容和設計。 在富文字元素中,您可以使用AI助手 來建立或細化行動呼籲內容。
- 若要刪除元素,請將遊標暫留於該元素上,然後按一下delete 刪除圖示。
- 在左側面板中,點擊「設計」索引標籤,即可自訂並預覽行動呼籲。
- 若要在特定頁面上預覽行動呼籲,請在右上角點擊「預覽」。 然後,按一下特定頁面上的預覽下拉式選單,然後選擇HubSpot頁面以預覽行動呼籲。
-
- 如要自訂行動呼籲的外觀,請選擇以下其中一個選項。 然後,在左側面板中設定變更。
- 位置:對於置頂橫幅行動呼籲,您可以選擇頂部或底部位置。 對於滑入式行動呼籲,你可以將行動呼籲放在頁面的左上角、左下角、右上角或右下角。
- 調整大小:設定行動呼籲的高度,你可以切換選項,根據行動呼籲的內容自動設定高度。
- 布局:配置CTA的布局。 你可以在行動呼籲內容中新增內邊距。 你也可以切換選項以啟用響應式佈局。 採用回應式版面配置後,行動呼籲欄位會垂直堆疊在小螢幕上。
- 樣式:設定行動呼籲的樣式,例如行動呼籲的主要字型、邊框和陰影。 你可以在行動呼籲中使用自訂字型,進一步了解如何在HubSpot內容中使用自訂字型。
- 背景:為行動呼籲設定背景,你可以選擇設定背景顏色或上傳背景圖片。
- 關閉選項:對於彈出式視窗行動呼籲,您可以切換選項,讓訪客在點擊彈出式視窗以外的任何地方時關閉行動呼籲。 關閉此選項後,訪客只能使用關閉圖示關閉行動呼籲。
- 如要自訂行動呼籲的外觀,請選擇以下其中一個選項。 然後,在左側面板中設定變更。
設計HTML行動呼籲
若要建立自訂的嵌入式HTML行動呼籲並套用自訂佈景主題或CSS ,請按照以下步驟操作:
- 在左側面板中,按一下從頭開始。
- 然後,按一下以展開進階選項,並選擇嵌入式HTML。
- 點擊「連結至」下拉式選單,然後選擇要重新導向至的CTA選項:
- 電子郵件地址:建立mailto連結。 若要在新頁面中開啟此連結,請選取在新分頁中開啟連結核取方塊。
- 檔案下載:將行動呼籲連結至檔案管理員中的檔案。 選擇現有檔案或上傳新檔案,然後如果您希望點擊按鈕CTA的訪客在新的瀏覽器視窗中查看圖像,請選擇在新分頁中打開連結核取方塊。
- 會議連結:將行動呼籲連結至HubSpot會議連結。 按一下「選擇會議連結」下拉式選單,然後選取會議連結。 若要在新頁面中開啟此連結,請選取在新分頁中開啟連結核取方塊。
- 其中一個頁面:將行動呼籲連結至HubSpot頁面或部落格文章。 點擊頁面下拉式選單,然後選擇頁面或文章。 按鈕CTA的連結將與頁面ID綁定,頁面網址的任何變更都會自動更新按鈕CTA的連結。 若要在新頁面中開啟此連結,請選取在新分頁中開啟連結核取方塊。
- 網址:將行動呼籲連結至HubSpot以外的外部頁面。 在「連結網址」欄位中,輸入您要引導訪客的網站網址。 若要在新頁面中開啟此連結,請選取在新分頁中開啟連結核取方塊。
- 行動呼籲:使用自訂行動呼籲觸發置頂橫幅、彈出式方塊或滑入式行動呼籲。
- 在按鈕內容欄位中輸入行動呼籲文字。
- 如要進一步自訂行動呼籲的設計,請點擊「進階」
- 在「進階」頁面上,您可以新增自訂CSS類別或規則:
- 自訂CSS類別:輸入CTA的自訂類別。 使用自訂類別,在網站的多個行動呼籲中套用設計樣式,例如字體系列。 任何自訂CSS類別都應包含在HubSpot頁面中使用的CSS樣式表中。
- 自訂CSS規則:新增自訂規則,套用特定於行動呼籲內嵌樣式。
- 若要新增CSS規則,請按一下「新增」或「+新增」,然後 設定選擇器和樣式。
- 選擇器:輸入CSS選擇器。 此值為選填項目,並會與行動呼籲的選擇器合併使用。 例如,如果輸入的選擇器是
:hover
,則組合的選擇器變為${ctaSelector}:hover
- 樣式:輸入要套用至已配置選擇器的自訂CSS樣式規則。 您可以在不輸入選擇器的情況下輸入樣式。 例如,
color: yellow;
。
- 選擇器:輸入CSS選擇器。 此值為選填項目,並會與行動呼籲的選擇器合併使用。 例如,如果輸入的選擇器是
- 若要新增CSS規則,請按一下「新增」或「+新增」,然後 設定選擇器和樣式。
- 若要編輯現有的CSS規則,請將遊標暫留於規則上,然後按一下edit 編輯圖示。
- 若要複製CSS規則,請將遊標暫留於規則上,然後按一下duplicate 製圖示。
- 若要管理CSS規則的優先順序,請按一下並拖曳每個規則,以按優先順序排列。
- 若要移除CSS規則,請將遊標暫留於規則上,然後按一下delete 刪除圖示。
- 若要將相同的HTML和類別套用到CTA作為舊版CTA ,請選取使用舊版標記核取方塊。 如果您在頁面上使用CSS樣式表來設定舊版行動呼籲的樣式,選取此核取方塊將允許HTML行動呼籲採用相同的樣式。
- 若要完成設定行動呼籲設計,請點擊「儲存並套用」。
自訂置頂橫幅、彈出式方塊或滑入式行動呼籲顯示的位置和時間
如果你已設定置頂橫幅、彈出式方塊或滑入式行動呼籲,請選擇此行動呼籲在網站上顯示的時間來鎖定訪客。 進一步了解如何在頁面中新增行動呼籲。
你可以使用篩選條件來合併多組規則,讓訪客知道哪些規則會顯示你的行動呼籲。 深入瞭解如何設定目標規則。
啟動觸發器
選擇啟用觸發因素,以決定行動呼籲在頁面上顯示的時間。 達到第一個選定的觸發因素後,系統會顯示行動呼籲。
- 在頂部按一下「目標設定」標籤頁。
- 在「何時應顯示」區段中,按一下以切換要使用的啟用觸發器旁邊的開關:
- 點擊按鈕時觸發:當訪客點擊按鈕時,系統會顯示行動呼籲。 了解如何設定彈出式行動呼籲,以便在點擊按鈕時觸發。 根據預設,此選項始終為開啟狀態。
- 使用預設按鈕模組在HubSpot頁面中或透過自訂按鈕的類別在外部頁面上配置。
- 若要在外部頁面上設定此觸發器,必須安裝HubSpot追蹤程式碼 。
- 頁面捲動時觸發:當訪客捲動超過頁面的指定百分比時,系統會顯示行動呼籲。
- 結束時觸發:當訪客將遊標移動到瀏覽器視窗的頂部欄時,系統會顯示行動呼籲。
- 經過時間後觸發:行動呼籲會在指定的秒數後出現。
- 停用後觸發:訪客停用指定秒數後,系統會顯示行動呼籲。
- 點擊按鈕時觸發:當訪客點擊按鈕時,系統會顯示行動呼籲。 了解如何設定彈出式行動呼籲,以便在點擊按鈕時觸發。 根據預設,此選項始終為開啟狀態。
網站網址
在相同的「目標設定」索引標籤中,為特定網頁URL或查詢參數值新增條件邏輯。 根據預設,行動呼籲會顯示在所有頁面上。
- 若要在訪客瀏覽特定網站網址時顯示行動呼籲,請前往「網站網址」部分
- 按一下第一個下拉式選單,然後選取網站網址。
- 按一下第二個下拉式選單,然後選取目標規則。
- 在文字欄位中輸入您的規則條件。
- 若要在訪客瀏覽網址包含特定查詢參數的網站頁面時顯示行動呼籲,請按照以下步驟操作:
- 按一下第一個下拉式選單,然後選取查詢參數。
- 在第一個文字欄位中,輸入查詢參數名稱。
- 按一下第二個下拉式選單,然後選取目標規則。
- 在第二個文字欄位中,輸入查詢參數值。
- 若要新增其他規則,請按一下「新增規則」。
- 若要從特定頁面排除行動號召,請按一下「新增排除規則」。 例如,您可能希望為隱私政策頁面新增排除條款。
訪客資訊和行為
您也可以根據已知訪客資訊和行為,在「設定目標」分頁中設定特定客服案件的目標 。 你可以新增的篩選規則類型取決於帳戶的訂閱。
- 若要向指定網站上的所有訪客顯示行動呼籲,請選取「所有訪客」。 預設情況下會選取此選項。
- 若要向特定訪客顯示行動呼籲,請點擊「已篩選的訪客」選項。 接著,請設定篩選條件:
- 點擊第一個下拉式選單,選擇如何篩選訪客。
-
- 點擊下一個下拉式選單,選擇篩選規則。
- 若要新增更多顯示行動呼籲的規則,請點擊「新增規則」,然後選擇篩選條件。
-
- 選擇隱藏行動呼籲的時間:
- 按一下「新增排除規則」。
- 點擊第一個下拉式選單,選擇隱藏行動呼籲的時間。
- 點擊下一個下拉式選單,選擇篩選規則。
- 若要新增更多隱藏行動呼籲的規則,請點擊「新增排除規則」,然後選擇篩選條件。
- 選擇隱藏行動呼籲的時間:
-
- 若要建立另一組篩選規則,請按一下新增篩選羣組,然後選取篩選規則。
顯示頻率
訪客首次關閉你的置頂橫幅、彈出式方塊或滑入式行動呼籲後,請選擇是否要再次顯示行動呼籲,以及顯示頻率。 在「設定目標」分頁中,設定行動呼籲的顯示頻率:
- 在顯示頻率部分,按一下S how again下拉式選單,然後選擇頻率:
- 設定一段時間後:設定訪客關閉行動呼籲後應經過的時間,然後再次顯示行動呼籲。
- 重複:每次訪問所選網頁時都會顯示行動呼籲,並執行觸發動作,即使他們之前曾與此動作互動過。
- 不要再顯示:只向訪客顯示一次行動呼籲。 首次顯示後,切勿再顯示行動呼籲。
請注意:在按鈕點擊時使用觸發器作為啟用觸 發器時,這不適用於行動呼籲。
自訂行動呼籲選項
在「選項」分頁上,自訂不同的行動呼籲選項,例如是否以小尺寸顯示行動呼籲、任何相關活動,以及行動呼籲的排程。
- 在頁面頂部,按一下「選項」分頁。
- 對於置頂橫幅、彈出式方塊或滑入式行動呼籲,你可以在小螢幕上隱藏行動呼籲。 在小螢幕尺寸部分,選取關閉小螢幕尺寸核取方塊。
- 如果你已訂閱行銷中心專業版或企業版,可以將行銷活動與行銷活動建立關聯:
- 若要將行動呼籲與現有行銷活動建立關聯,請按一下「行銷活動」下拉式選單,然後選取行銷活動。
- 若要將行動呼籲與新行銷活動建立關聯,請按一下「行銷活動」下拉式選單,然後按一下「建立行銷活動」。 然後,請繼續設定推廣活動。
-
- 如果你之前從未建立推廣活動,請按一下「建立推廣活動」。 然後,請繼續設定推廣活動。
- 使用行動呼籲設定追蹤點擊次數的方式。 從以下選項中選擇:
- 透過重新導向追蹤點擊次數:在將訪客重新導向至最後一個頁面之前,先將訪客導向至初始網址,將點擊次數與CTA相關聯,以追蹤點擊次數。 預設情況下會選取此選項。
- 透過瀏覽器追蹤點擊次數:透過訪客的瀏覽器異步追蹤點擊次數。 此選項允許您使用錨點標籤,因為沒有重定向, CTA將將訪客引導到設置的URL。
- 對於置頂橫幅、彈出式方塊或滑入式行動呼籲,你可以預約行動呼籲顯示的時間:
- 若要排定行動呼籲開始顯示的時間,請將「排程」切換為稍後開啟。 然後,選擇開始日期和時間。
- 若要排定行動呼籲停止顯示的時間,請將「設定取消發佈日期和時間」切換為開啟。 然後,選擇結束日期和時間。
發佈你的行動呼籲
完成行動呼籲設定後,請發佈行動呼籲以進行直播。
- 點擊右上角的「查看並發佈」。
- 在右側面板中查看你的行動呼籲,然後點擊「立即發佈」。 行動呼籲會自動發佈到目標頁面。