Module form field only shows legacy forms

[tmcmillan99]

I have the form field in numerous custom modules in our theme and for some reason, we can only see forms created with the legacy editor. What am I missing for the forms created in the new editor?

I do not see any settings on the form field that allow both form types.

Thanks,

Terry

[Markestac · Accepted solution]

Hi @tmcmillan99 ,
In HubSpot, the form field used within custom modules or theme modules currently only supports legacy forms.To use drag-and-drop forms created in the new form editor, we recommend using HubSpot’s built-in Form module. This module is available in the page editor's left panel and fully supports the latest form functionality without requiring custom code.

Hope this helps!
Thanks

[tmcmillan99]

@Anton @Markestac Thanks for the replies and additional information. That's what I was looking for. I was wondering how theme creators were suppose to handle that scenario with their custom modules. Unless I missed it, Hubspot doesn't really address that with the new form editor.

[Anton · Accepted solution]

Hey @tmcmillan99, 

as @Markestac pointed out correctly custom modules currently support only legacy forms - huge bummer but there are ways how you can embed/use the new forms in custom modules. 

Something you can do to use the new forms in custom modules is:

- Grab an embed code from the new form builder

- paste it in your custom module

- modify it to your needs and add a text field(not rich-text) to the module for the form id

Example:

the default embed code

<script src="https://js-eu1.hsforms.net/forms/embed/123456789.js" defer></script>
<div class="hs-form-frame" data-region="eu1" data-form-id="xxxxxxxx-xxxx-xxxx-xxxx-xxxxxxxxxxxx" data-portal-id="123456789"></div>

becomes this:

{% require_head %}
<script src="https://js-eu1.hsforms.net/forms/embed/{{hub_id}}.js" defer></script>
{% end_require_head %}
<div class="hs-form-frame" data-region="eu1" data-form-id="{{module.form_id_text}}" data-portal-id="{{hub_id}}"></div>

Note that form_id_text is not a form function but a simple text one.

best, 

Anton

[Markestac · Accepted solution]

Hi @tmcmillan99 ,
In HubSpot, the form field used within custom modules or theme modules currently only supports legacy forms.To use drag-and-drop forms created in the new form editor, we recommend using HubSpot’s built-in Form module. This module is available in the page editor's left panel and fully supports the latest form functionality without requiring custom code.

Hope this helps!
Thanks