외부 페이지에 HubSpot 양식을 임베드할 때 양식이 원하는 위치와 다른 위치에 표시될 수 있습니다.
이는 페이지에서 양식이 동적으로 렌더링되거나 페이지 HTML의 동일한 <div> 태그에 여러 개의 양식 임베드 코드가 추가되는 문제 때문일 수 있습니다.
이러한 문제는 양식 임베드 코드를 사용자 지정하여 해결할 수 있습니다. HubSpot의 개발자 문서에서 양식 임베드 코드 사용자 지정에 대해 자세히 알아보세요.
단일 양식
양식이 페이지에서 동적으로 렌더링되어 다른 위치에 로드되는 경우가 있습니다. 때로는 구형 브라우저에서는 양식이 표시되지 않을 수도 있습니다.
페이지의 특정 부분에서 양식이 성공적으로 로드되도록 하려면 양식 임베드 코드에 대상 속성을 추가하여 양식을 렌더링할 특정 컨테이너를 지정할 수 있습니다.
예를 들어 사이드바의 CSS 클래스가 있는 페이지의 컨테이너에서 양식이 렌더링되도록 할 수 있습니다. 양식 임베드 코드에 대상 속성을 추가하려면 다음과 같이 하세요:
양식 임베드 코드에서 formId 뒤에 쉼표(,)를 추가합니다.
그런 다음 새 줄을 입력하고 대상: '[컨테이너 이름]'을 입력합니다 .
여러 양식
외부 페이지에 동일한 HubSpot 양식을 여러 번 임베드하는 경우 양식이 나란히 또는 잘못된 위치에 표시될 수 있습니다. 이는 양식 임베드 코드가 페이지 HTML의 동일한 <div> 태그에 추가되는 경우 발생합니다.
양식이 올바르게 로드되고 표시되도록 하려면 formInstanceId 속성을 추가하고 각 양식 임베드 코드에 고유한 값을 지정하세요:
양식 임베드 코드에서 formId 속성 값 뒤에 쉼표(,)를 추가합니다,
그런 다음 새 줄을 입력하고 formInstanceId : '[숫자]'를 입력합니다.
페이지에 표시되는 순서대로 각 양식을 추가하고 번호를 매깁니다. 예를 들어 첫 번째 양식은 '1', 두 번째 양식은 '2'와 같은 식으로 입력합니다.
Forms
