貼上嵌入程式碼

嵌入程式碼是一行 HTML，貼在哪裡，表單就會顯示在哪裡。當佈景主題編輯器區塊不適用時可以使用它：放在自訂 Liquid 區段、頁面本身的內容中（與您的文字並列），或頁面建置工具應用程式中。

注意

開始之前：必須先開啟應用程式嵌入。程式碼只是標記位置，由應用程式嵌入負責把表單載入其中。請參閱開啟應用程式嵌入。表單也必須已發佈（在 Forms 中為 Active）。

複製嵌入程式碼

1. 開啟表單的選單

   在 Sami B2B Onboarding 中，前往 Forms。點擊該表單所在列的 …（More actions）。

2. 複製程式碼

   選擇 Copy embed code。畫面會出現 Code copied 訊息。

   程式碼如下所示，最後一組引號中是您表單的代稱：

   <div class="samitaB2BOD-app" data-samita-b2bod-form="wholesale-application"></div>

第一次儲存新表單後開啟的 Your form is ready 對話方塊，在 Embed code 之下也有相同的程式碼。

若要一律顯示您的預設表單，請清空最後一組引號中的內容：data-samita-b2bod-form=""。

接著將它貼到下列三個位置之一。

貼到自訂 Liquid 區段

大多數佈景主題都包含可接受這類程式碼的自訂 Liquid 區段。

1. 開啟佈景主題編輯器

   在 Shopify 後台中，前往線上商店 › 佈景主題，並在您目前的佈景主題上點擊編輯佈景主題。使用頂端的範本選單，開啟要放置表單的範本。

2. 新增自訂 Liquid 區段

   在左側邊欄的範本之下，點擊新增區段，在搜尋區段中輸入 Custom Liquid，然後選擇自訂 Liquid。

3. 貼上程式碼

   點擊新增的區段，並將嵌入程式碼貼到其程式碼框中。預覽中就會顯示您的表單。

   

   將嵌入程式碼貼到自訂 Liquid 區段，表單就會顯示在該處。

4. 儲存

   點擊佈景主題編輯器右上角的儲存。

貼到頁面內容中

當您想把表單放在頁面內，並在上方或下方加入自己的文字時，請使用這個方式。

1. 開啟頁面

   在 Shopify 後台中，前往線上商店 › 頁面。開啟該頁面，或點擊新增頁面建立一個，並為它設定標題。

2. 切換到 HTML

   在內容編輯器的工具列中，點擊顯示 HTML（<> 按鈕）。

3. 貼上程式碼

   將嵌入程式碼貼在您希望表單出現的位置。您自己的文字可以保留在它的前面或後面。

   

   在頁面的 HTML 中，將嵌入程式碼放在您希望表單顯示的位置。

4. 儲存

   點擊儲存。請確認頁面為可見狀態，這樣買家才能開啟。

貼到頁面建置工具

頁面建置工具應用程式通常有可放入 HTML 或自訂程式碼的元素。

1. 新增 HTML 元素

   在您的頁面建置工具中，於要放置表單的位置新增其 HTML 或自訂程式碼元素。

2. 貼上並發佈

   將嵌入程式碼貼到該元素中，然後儲存並發佈頁面。該頁面必須屬於您的線上商店，應用程式嵌入才能在其上運作。

在商店中檢查

1. 以訪客身分開啟頁面

   在私密瀏覽視窗中開啟頁面，這樣您看到的就是未登入的買家所見的畫面。稍候片刻，表單就會出現在您貼上程式碼的位置。

2. 視需要修正問題

   • 貼上程式碼的位置沒有顯示任何內容。 請確認應用程式嵌入已開啟，且程式碼是原樣貼上。
   • This form is not available right now. 程式碼中的代稱與任何已發佈的表單都不相符。請重新複製程式碼，或在 Forms 中發佈該表單。

注意事項

• 您可以在任意多個位置貼上程式碼，也可以在不同頁面使用不同的表單。
• 如果您鎖定商店，來自線上商店 › 頁面且包含表單的頁面，仍會對訪客開放。貼在其他類型頁面（例如首頁）上的表單，則不會讓該頁面開放。請參閱鎖定商店。
• 已經提出申請的登入顧客，會看到關於其申請的訊息，而不是表單。請參閱買家送出之後。

後續步驟

• 在佈景主題編輯器中加入表單區塊：不需任何程式碼，即可將表單作為區段放置。
• 設計表單：讓表單的外觀與您貼上的頁面相符。
• 鎖定商店：在表單保持開放的同時，讓商店其他部分維持私密。