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

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

上次更新時間: 一月 20, 2023

套用至:

所有產品和版本

當您在外部頁面上嵌入HubSpot表單時,您可能會看到它在不同的位置顯示。 這可能是由於表單在頁面上動態渲染,或是多個表單嵌入代碼被新增到頁面HTML中的相同< div >標籤的問題。

在頁面上動態渲染表單

表單可以在頁面上動態渲染,並在不同位置載入。 若要確保表單載入網頁的特定部分,請將目標屬性新增至表單嵌入代碼,以指定要渲染表單的特定容器。

在表單嵌入代碼中,在formId屬性值之後新增逗號(,) ,然後輸入新行並輸入目標: '[容器名稱]'。 例如,您可以使用側邊欄CSS類別強制表單在頁面上的容器中渲染

User-added image

了解更多有關在HubSpot開發人員文件中自訂表單嵌入代碼的資訊。

添加到相同< div >標籤的多個表單嵌入代碼

當您在外部頁面上多次嵌入相同的HubSpot表單時,如果表單嵌入代碼被添加到頁面HTML中的相同< div >標籤中,表單可能會並排出現或位於錯誤的位置。

為了確保表單載入和顯示正確,請新增formInstanceId屬性,並為每個表單嵌入代碼指定一個獨特的值。 在表單嵌入代碼中,在formId屬性值之後新增逗號(,) ,然後輸入新行並輸入formInstanceId: '[number]'。   建議按照頁面上顯示的順序為每個表單編號(例如,第一個表單的「1」,第二個表單的「2」等)。

User-added image
用戶添加的圖片

表單不會在舊瀏覽器中載入

在舊瀏覽器中,某些Javascript可能與HubSpot的嵌入代碼相衝突,並導致表單不載入。 

為了確保表單載入和顯示正確,可以將目標屬性新增至每個表單的嵌入代碼,以指定要渲染表單的特定容器。

form-embed-target

了解更多有關在HubSpot開發人員文件中自訂表單嵌入代碼的資訊。 

Was this article helpful?
This form is used for documentation feedback only. Learn how to get help with HubSpot.