Embedded Typeform only loads on Refresh | Community
Skip to main content
Question

Embedded Typeform only loads on Refresh


Forum|alt.badge.img

Hi - I’ve read a few posts about this but can’t figure why my form only loads on refresh. 

 

https://brendanryan.ie/GET-A-QUOTE/1

 

The website is built using a photography specific platform APhotoFolio 

 

Any thoughts or suggestions appreciated. 

 

Thanks, 

14 replies

Liz
Community Team
Forum|alt.badge.img+5
  • Tech Community Advocate
  • 15023 replies
  • March 13, 2024

Hi @Brendan1234 Thanks for stopping by the community. I haven’t used the builder APhotoFolio, but I’m guessing this might be similar to the issue we’ve had with Squarespace embeds. 

Do you mind sharing a screenshot of how you’ve added the form to your website? Thanks in advance!


Forum|alt.badge.img
  • Author
  • Explorer
  • 9 replies
  • March 13, 2024

Hi Liz, 

 

Thanks for your reply. The website uses HTML pages… I’ve attached a screenshot here

 


Forum|alt.badge.img
  • Author
  • Explorer
  • 9 replies
  • March 13, 2024

When I go directly to the link the form work 

 

when I click on the menu item the form doesn’t load and needs to be refreshed...


Forum|alt.badge.img
  • Author
  • Explorer
  • 9 replies
  • March 13, 2024

Very Unusual - when I set it to open in new window it loads but can’t seem to get it to load within the same page without a refresh. 


Liz
Community Team
Forum|alt.badge.img+5
  • Tech Community Advocate
  • 15023 replies
  • March 14, 2024

Huh, thanks for sharing this, @Brendan1234 . @mathio do you happen to have any idea why it wouldn’t be loading on the first try? 


Forum|alt.badge.img
  • Author
  • Explorer
  • 9 replies
  • March 14, 2024

Thanks for your help Liz. My website support are looking into it too but I might need to come up with a different solution. 


Liz
Community Team
Forum|alt.badge.img+5
  • Tech Community Advocate
  • 15023 replies
  • March 14, 2024

@mathio ‘s pretty good at getting to the bottom of it, so hopefully both teams together will solve the issue! 


mathio-tf
Typeform
Forum|alt.badge.img+5
  • Typeform
  • 888 replies
  • March 14, 2024

Hello @Brendan1234 

since your website is loading content dynamically (as single-page app) the <div> with your typeform is injected dynamically. You need to run window.tf.load() when the specific page loads.

Alternatively you can use our embed SDK directly to render the embedded form in your page on navigation event using window.tf.createWidget method.

 

 


Forum|alt.badge.img
  • Author
  • Explorer
  • 9 replies
  • March 14, 2024

Many thanks mathio 

 

Thats a little bit over my head but I’ll send it to my web support and hopefully they’ll be able to figure it out from here. 


Liz
Community Team
Forum|alt.badge.img+5
  • Tech Community Advocate
  • 15023 replies
  • March 14, 2024

Let us know how it goes, @Brendan1234 !


Forum|alt.badge.img
  • Author
  • Explorer
  • 9 replies
  • March 14, 2024

Hey @Liz - Unfortunately not getting very far. 

 

@mathio I’m not sure where to put the window.tf.load code. With my site I have 2 options in the site head for javascript or the page for html

 

I almost had a little bit of luck running a html refresh code but I got stuck in a constant refresh loop 😅

 


Forum|alt.badge.img
  • Author
  • Explorer
  • 9 replies
  • March 14, 2024

Got it working by using an iframe - very simple solution 

 

Thanks for your help

Brendan 

 


Liz
Community Team
Forum|alt.badge.img+5
  • Tech Community Advocate
  • 15023 replies
  • March 14, 2024

Glad it worked with an iFrame, @Brendan1234 ! Let us know if you need help with anything else. 


mathio-tf
Typeform
Forum|alt.badge.img+5
  • Typeform
  • 888 replies
  • March 15, 2024

You should include your embed code as you did before and then put the a window.tf.load() (with no attributes) into a script that is executed after your page is loaded. Eg. into a function that handles the navigation event. I am sorry but I am not familiar with the website builder you are using, you will need to consult their documentation or support.

Of course using an iframe is an option as well, if you are not using any advanced features provided by embed SDK. Just keep in mind we do not provide support for custom embeds without the SDK.