Yggoire Posted August 30, 2021 Posted August 30, 2021 Site URL: https://www.cestplusquedelasf.com/podcasts Hello, I have a problem with a jQuery code injection, which works perfectly on the back-office but does not work on the online version of the website. The most frustrating thing is that it works fine on the online version when I refresh the page, but not when I get there by clicking on a link. I have of course checked and the code is indeed present in the <head> section of the relevant pages. The code concerns the replacement of certain words by others, more relevant for users and SEO, available here : <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script> <script> jQuery(function($){ $(".BlogList-filter").html(function() { return $(this).html().replace("Articles", "Podcasts"); }); }); jQuery(function($){ $(".BlogList-pagination-link-label").html(function() { return $(this).html().replace("Plus anciens", "Podcasts précédents"); }); }); jQuery(function($){ $(".BlogList-pagination-link-label").html(function() { return $(this).html().replace("Plus récents", "Podcasts suivants"); }); }); </script> Do you have any idea what's going on? Thank you in advance, Best regards,
tuanphan Posted August 31, 2021 Posted August 31, 2021 try this <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script> <script> jQuery(function($){ $(".BlogList-filter").html(function() { return $(this).html().replace("Articles", "Podcasts"); }); $(".BlogList-pagination-link-label").html(function() { return $(this).html().replace("Plus récents", "Podcasts suivants"); }); $(".BlogList-pagination-link-label").html(function() { return $(this).html().replace("Plus anciens", "Podcasts précédents"); }); }); </script> Email me if you have need any help (free, of course.). Answer within 24 hours. Or send to forum message Contact Customer Care - Learn CSS - Buy me a coffee (thank you!)
paul2009 Posted August 31, 2021 Posted August 31, 2021 22 hours ago, Yggoire said: I have a problem with a jQuery code injection. I have of course checked and the code is indeed present in the <head> section of the relevant pages. If you are loading this in the header section of Code Injection as you mentioned, then the code is likely to look for the page elements before they have loaded. As the elements are not there, it cannot make changes. As a starting point, you should move it to the footer section of Code Injection so that it runs after the page elements. That said, there are further improvements that you can make so that your code is safer. I say this because the code snippets above are not professionally written and appear to have been 'stitched together' from snippets written by someone learning jQuery. It also includes a jQuery library that has known security vulnerabilities. This is not a criticism of the person who wrote it, or of learning coding - I'm absolutely in favour of helping anyone to learn coding - it's just some encouragement to learn a little more so that code does not adversely affect your site's performance. For example: Instead of the older jQuery version 3.4.1 (April 2019), use 3.5.1 or 3.6.0. At this point, they have no known vulnerabilities. It's a good idea to use some code to check that the page has fully loaded before you use further code (like your snippet above) to attempt to manipulate it. JQuery has a .ready() method that offers a way to make your changes as soon as the page (known as the Document Object Model or DOM) becomes safe to manipulate. You'll find more details in this tutorial: W3 Schools: jQuery ready() Method Me: I'm Paul, a SQSP user for >18 yrs & Circle Leader since 2017. I value honesty, transparency, diversity and good design ♥. Work: Founder of SF.DIGITAL. We provide high quality original extensions to supercharge your Squarespace website. Content: Views and opinions are my own. Links in my posts may refer to my own SF.DIGITAL products or may be affiliate links. Forum advice is completely free. You can thank me by selecting a feedback emoji. Buying a coffee is generous but optional.
Recommended Posts
Archived
This topic is now archived and is closed to further replies.