APIs & Integrations

SRalston05
Member

Embedded form code won't update

SOLVE

I've been working on a project for weeks and this problem just started happening yesterday. I have a HS form embedded in a HS page. The code is in the HTML source of an html element in the page. For some reason that code stopped being updated in the browser. I have a linked script in the template and if I change it the edit shows up in the browser right away. I have some code in the template 'Additional <head> markup' field and that updates immediately. I can edit the page itself and those changes show up fine. But the code in that html element refuses to update. Any thoughts?

0 Upvotes
2 Accepted solutions
Anton
Solution
Thought Leader | Partner
Thought Leader | Partner

Embedded form code won't update

SOLVE

Hey @SRalston05

thanks for the informations. 

As you're using the "Act html element", I assume you're using the Act theme and this is a custom module. It should basically be just a rich-text with a few things to render the HTML output directly. 

This makes debugging a bit harder, but we'll get there. 

 

One thing I assume is happening:

Since you're putting the embed code directly into the HTML module, the scripts are interfering with each other as the scripts of the module are being loaded somewhere in the body instead of the <head> or at the end of the <body> tag. Therefore the request to get the updated form is either being overwriten or not happening at all (would be strange, but who knows). 

Have you tried using the default Form module of HubSpot and select the form directly? Just for testing purposes as those can't be modified in a way how you need it.

This would help understanding if it's a module, embed code or something else error. 

You can also try to use the default Rich-Text module and place your embed code into the source-code view of it. Maybe it's an Act theme topic. 

 

In terms of the 2 JS scripts in the <head>, have you thought about just using Form events instead of seperate JS? Could help

 

Last but not least and something many people don't know (and learn to late):
If you create a DND template, create a page with this template and apply the slightest change to the page in the page editor, HS will create a "non-accessible" clone of the template for this specific page. All further changes to the template won't be applied to this specific page. Only to the pages that will be created after the template change. 

This means that if you have created a page, added something like a text/button or even a comma somewhere, changes to the template won't be applied to the page. 

It's kinda like a protection layer to prevent a bunch of pages going down the rabit hole if you're changing the template. 

 

So something I'd try is creating a new page (doesn't have to be published) after you've changed the template

 

Hope this help

 

best, 

Anton

Anton Bujanowski Signature

View solution in original post

0 Upvotes
SRalston05
Solution
Member

Embedded form code won't update

SOLVE

You're absolutely right about the locked template thing. Apparently if you make any edit to the page itself, Hubspot silently and undocumentedly makes a locked version of the template at that time. From that point on, no edits you make to the template will effect the page, because HS is using the locked, silently created version of the template on the page. That really **bleep** me off. I don't even recall exactly what I did but I think I just added the time to the page title. I'm no HS expert but I have been working with it for a few years and I've never encountered this before. So, I made a new page using the template I've been developing all along, and my template edits immediately became evident.

 

Thanks very much for your time and input!

 

 

View solution in original post

0 Upvotes
5 Replies 5
Anton
Thought Leader | Partner
Thought Leader | Partner

Embedded form code won't update

SOLVE

Hey @SRalston05

can you please share a bit more information?

  • How are you embeding/using the form code?
    • HubSpot default module?
    • Custom module?
    • Embeding the form embed code in something like a rich-text?
    • Embeding the form embed code directly in a template?
  • What does the 'Additional <head> markup' field contain?
  • Have you tried clearing the browser and HubSpot cache?
    • To clear HubSpot Cache, open the Portal settings(gear icon top right), go to Content -> Pages, scroll to the "Additional Header content", add something like a space and save
  • Have you tried adding &hsCacheBuster=7580 to your preview url (not page builder)? P.S: The 4-digit number is random and you can change it to what ever you like
  • How (and what) are you applying your changes?

 

 

best, 

Anton

Anton Bujanowski Signature
SRalston05
Member

Embedded form code won't update

SOLVE

Hi Anton,

I'll answer your questions as best I can. I'm not sure of all the HS nomenclature, but here goes.

 

How am I embedding/using the code? The form is embedded in a template.  The form was created with the Legacy editor but because of programmatic things we need to do with the form input, we can't just place the form on the template. So on the template where we want the form I placed the Act html element. I don't know if that's the default HS html element or some third-party thing. When viewing the template in the editor, I click the html element and in the right sidebar there appears a 'Edit HTML source' button. I click that and it opens a code editor, where all the code for the embedded form lives. 

 

What does the 'Additional <head> markup' field contain? There are 2 Javascript functions. One takes the contact info from the form and builds a URL with query strings, based on the user's address. The other is a document.addEventListener that calls the first one when the form is submitted.

 

Have you tried clearing the browser and HubSpot cache? Yep, cleared both.

 

Have you tried adding &hsCacheBuster? I didn't know of that trick but tried it per your suggestion. That didn't have any effect.

 

How (and what) are you applying your changes? When I make edits to the embedded code in the template I click the 'Publish changes' button on the template and I go to the page in the HS page editor and click the 'Update' button.

As I said in the initial post, I've been doing it just like this for weeks. I don't have any idea why it started acting up.

 

Steve

0 Upvotes
Anton
Solution
Thought Leader | Partner
Thought Leader | Partner

Embedded form code won't update

SOLVE

Hey @SRalston05

thanks for the informations. 

As you're using the "Act html element", I assume you're using the Act theme and this is a custom module. It should basically be just a rich-text with a few things to render the HTML output directly. 

This makes debugging a bit harder, but we'll get there. 

 

One thing I assume is happening:

Since you're putting the embed code directly into the HTML module, the scripts are interfering with each other as the scripts of the module are being loaded somewhere in the body instead of the <head> or at the end of the <body> tag. Therefore the request to get the updated form is either being overwriten or not happening at all (would be strange, but who knows). 

Have you tried using the default Form module of HubSpot and select the form directly? Just for testing purposes as those can't be modified in a way how you need it.

This would help understanding if it's a module, embed code or something else error. 

You can also try to use the default Rich-Text module and place your embed code into the source-code view of it. Maybe it's an Act theme topic. 

 

In terms of the 2 JS scripts in the <head>, have you thought about just using Form events instead of seperate JS? Could help

 

Last but not least and something many people don't know (and learn to late):
If you create a DND template, create a page with this template and apply the slightest change to the page in the page editor, HS will create a "non-accessible" clone of the template for this specific page. All further changes to the template won't be applied to this specific page. Only to the pages that will be created after the template change. 

This means that if you have created a page, added something like a text/button or even a comma somewhere, changes to the template won't be applied to the page. 

It's kinda like a protection layer to prevent a bunch of pages going down the rabit hole if you're changing the template. 

 

So something I'd try is creating a new page (doesn't have to be published) after you've changed the template

 

Hope this help

 

best, 

Anton

Anton Bujanowski Signature
0 Upvotes
SRalston05
Solution
Member

Embedded form code won't update

SOLVE

You're absolutely right about the locked template thing. Apparently if you make any edit to the page itself, Hubspot silently and undocumentedly makes a locked version of the template at that time. From that point on, no edits you make to the template will effect the page, because HS is using the locked, silently created version of the template on the page. That really **bleep** me off. I don't even recall exactly what I did but I think I just added the time to the page title. I'm no HS expert but I have been working with it for a few years and I've never encountered this before. So, I made a new page using the template I've been developing all along, and my template edits immediately became evident.

 

Thanks very much for your time and input!

 

 

0 Upvotes
STierney
Community Manager
Community Manager

Embedded form code won't update

SOLVE

Hey @SRalston05 - thanks so much for posting in the Community!

I'd like to tag in some HTML experts here to see if they have any insight on this behavior. @Anton, @alyssamwilie, and @Stephanie-OG - any thoughts on why this may be happening?

Shane, Senior Community Moderator





loop


Loop Marketing is a new four-stage approach that combines AI efficiency and human authenticity to drive growth.

Learn More




0 Upvotes