paul2009 28,454 Posted August 8, 2017 (edited) When javascript has been added to a newer template, it doesn't always work until the page/site is refreshed. Why? Edited August 8, 2017 by Paul2009 Initial Revision 2 paul2009 and simon reacted to this If a response has helped you, please give thanks using the button.Need personalised help? I'm a professional Developer who works with Designers internationally. You can book me via my company's website. www.sf.digital Share this post Link to post
14 paul2009 28,454 Posted August 8, 2017 (edited) I've answered a number of questions on this subject. Each asks why a particular piece of code isn't working unless the page is refreshed or reloaded. Usually, the person is asking about code that they've found on this forum and that they've added to their site. They just can't understand why it doesn't work for them properly. It doesn't work the first time, but when they load the page a second time, it appears to work! I've posted this question to save others posting a series of related questions. So why is this happening? Ajax. If you're using one of the newer Squarespace templates, the chances are that it uses Ajax, a feature that allows parts of a page to be loaded, without loading the full page. For example, when a visitor wants to open a new page, it could be opened without reloading the header and footer. It can also power a feature called 'Infinite Scroll' where only the first few blog posts are loaded initially but as the visitor scrolls down the page, more blog posts download and appear. It will continue loading blog content until all of the posts have been displayed, hence appearing to be an infinitely long page. The downside is that when you have Ajax enabled, older JavaScript code that wasn't written to work with Ajax, won't work properly. That's the case with the majority of JavaScript answers on this site, especially pre-2018. So what can you do? The best solution is to source new Ajax-enabled code. If you are using code provided by a third-party company, ask them for an Ajax-enabled version to work with Squarespace. However, if you find code on this site, or on a similar site, that isn't Ajax compatible you have two choices. Hire a developer to write you some better code Use the code you've found and disable the Ajax features on your site. It's worth noting that disabling Ajax is not a solution. It's just a workaround. It will allow you to run old code that hasn't been written to work with Ajax-enabled sites but if you disable it, you will lose many more features that improve the performance of Squarespace sites. If your template uses Ajax loading (all the Brine-family templates do) and you want to disable Ajax you can do so in the Style Editor. To disable Ajax: Open a Blog Page then, in the Home Menu, click Design, and then click Style Editor. Scroll down to Site: Loading. Uncheck Enable Ajax Loading. This workaround will fix the issue, but it will disable Infinite Scroll and all Ajax features. I hope that helps. -Paul Squarespace Expert & Experienced Developer Edited August 8, 2017 by Paul2009 Initial Revision 2 rwiseco and e2astudio reacted to this If a response has helped you, please give thanks using the button.Need personalised help? I'm a professional Developer who works with Designers internationally. You can book me via my company's website. www.sf.digital Share this post Link to post
0 dubwebdev1570048561 0 Posted December 13, 2018 This was spot on and was informative in helping me understanding why this was happening. It helped resolve the issues I was having with the MindBody Online Branded Web Tools scripts. You are the man Paul. Share this post Link to post
0 bsewell 0 Posted March 7 This solved my problem immediately as well. Does anyone have more Ajax friendly hubspot embed coding to solve this? Share this post Link to post
When javascript has been added to a newer template, it doesn't always work until the page/site is refreshed. Why?
Edited by Paul2009Initial Revision
If a response has helped you, please give thanks using the
button.
Need personalised help? I'm a professional Developer who works with Designers internationally. You can book me via my company's website. www.sf.digital
Share this post
Link to post