知識庫

表格在外部頁面上的錯誤位置

作者:HubSpot Support | Nov 21, 2022 11:56:21 AM

在外部頁面上嵌入HubSpot表單時,您可能會看到它出現在與預期不同的位置。

這可能是由於在頁面上動態呈現的表單或多個表單嵌入代碼被添加到頁面HTML中的相同< div >標籤的問題。

這些問題可以透過自訂表單嵌入程式碼來解決。 進一步了解如何在HubSpot的開發人員文件自訂表單嵌入代碼

單一表單

表單有時可能會在頁面上動態渲染,並在不同的位置加載。 有時在較舊的瀏覽器上,表單甚至可能無法顯示。

為了確保表單在頁面的特定部分成功載入,您可以將目標屬性添加到表單嵌入代碼中,以指定要呈現表單的特定容器。

例如,您可以強制表單在頁面上的容器中呈現CSS類別的側邊欄。 若要將目標屬性新增至表單嵌入程式碼: 

  • 在表單嵌入程式碼中,在formId後面新增一個逗號(,)。
  • 然後,輸入一個新行並輸入目標: “[容器名稱]”。

 

多種表單

當您在外部頁面上多次嵌入相同的HubSpot表單時,表單可能會並排顯示或出現在錯誤的位置。 如果將表單嵌入代碼添加到頁面HTML中的相同< div >標籤中,則會發生這種情況。 

若要確保表單正確載入和顯示,請新增formInstanceId屬性,並為每個表單嵌入代碼指定唯一的值:

  • 在表單嵌入代碼中,在formId屬性值之後添加逗號( , ) ,
  • 然後,輸入一個新行,然後輸入formInstanceId: “[number]”。 
  • 按頁面上顯示的順序新增和編號每個表單。 例如,第一種形式爲“1” ,第二種形式爲“2” ,依此類推。