JavaScript not getting inserted into page

I’m attempting to insert a jQuery script into a page by using the Tools → Layout CSS / Javascript feature associated with page on my site. After adding the code I save the page, clear my server and browser cache, and then reload the page in the browser. When I review the source for the freshly loaded page I see zero evidence that the jQuery script has been included.

I’ve checked Settings → Beaver Builder → Advanced and see that the toggle for Enable Code Settings is on (green).

I’m not really sure what I have to do to get the code to publish or how to troubleshoot this problem.

Its hard to tell without a link to the page and knowing what you added.

Sure… here’s a link to the page…

https://vistamarina.it/test

The jQuery code used was…

jQuery(document).ready(function() {
	setInterval(function(){
	    jQuery("img#myimg").attr("src", "/wp-content/uploads/snapshots/vista-marina-cagliari-sardegna-webcam.jpg?"+new Date().getTime());},2000);
	});

The JS is right there at the bottom of this file
https://vistamarina.it/wp-content/uploads/bb-plugin/cache/145-layout.js
Which is where JS gets added if you use layout/global of node code settings

Ok… I’m feeling dunce-like at this moment. I expected the script to show up on the source of the page verbatim, not a link to another file. My bad. Thanks for educating me!!!

If you enable inline CSS/JS in advanced options the CSS and JS will be included inline in the raw HTML and you would have been able to find it :wink:

One small tip when you are messing with any code is to add debugging to the code so you know full well it is being executed rather than blind refreshing and looking for results to change, like this for example:

jQuery(document).ready(function() {
    console.log('hello world');
    var img = jQuery('#myimg img');
    var src = img.attr('src');
	setInterval( function() {
        console.log('Updating image src');
        img.attr('src', src + '?' + new Date().getTime() );
    }, 2000 );
});
1 Like