Javascript Not Running On Product Page

[bullseye_surplus]

I have two pieces of javascript I’d like to run on my page.

https://bullseyesurplus.com/products/categories/long-guns/

var elements = document.getElementsByClassName(“bc-product-archive__header”);
elements[0].innerHTML = elements[0].innerHTML.replace(/Category:/g,’’);

var elements = document.getElementsByClassName(“bc-product-archive__header”);
elements[0].innerHTML = elements[0].innerHTML.replace(/-/g,’’);

It’s purpose is to strip out “category:” and the “-” in “Long-Guns”.

It works fine inside of DevTools in Chrome, but even though I have added it to my JS on my theme options page, it isn’t executing on the product page.

[nabeel]

Hi Justin,

Thank you for reaching out to us. I checked your site and I see you’ve a syntax error in your Global JS section that’s why your code isn’t working. Please find and remove the following code first:

<link href="https://fonts.googleapis.com/css?family=Teko:700" rel="stylesheet">

<script> var _ctct_m = "b290aecc8f726f30919b8782973b07a7"; </script>
<script id="signupScript" src="//static.ctctcdn.com/js/signup-form-widget/current/signup-form-widget.min.js" async defer></script>

Please note that in Global JS section, you don’t need to include the <script></script> tags as they are already included, if you include them in the JS section, an error will be triggered which will break your JS functionality.

After removing the code you can use this code instead to modify the title:

jQuery(document).ready(function($){
	var elements = document.getElementsByClassName("bc-product-archive__header");
	elements[0].innerHTML = elements[0].innerHTML.replace(/Category:/g,'');

	var elements = document.getElementsByClassName("bc-product-archive__header");
	elements[0].innerHTML = elements[0].innerHTML.replace(/-/g,'');
});

Don’t forget to clear all caches including your browser’s cache after adding the code. Let us know how this goes!

[bullseye_surplus]

Thanks for the information. Doing what you suggested works, but only if I remove:

var _ctct_m = "b290aecc8f726f30919b8782973b07a7";
<script id="signupScript" src="//static.ctctcdn.com/js/signup-form-widget/current/signup-form-widget.min.js" async defer></script>

That is my constant contact required script. How do I embed that without breaking the page?

[nabeel]

Hi again,

To include the above script in your site, add the following code in your child theme’s functions.php file:

function custom_script() { 
?>
	<script>
		var _ctct_m = "b290aecc8f726f30919b8782973b07a7";
	</script>
	<script id="signupScript" src="//static.ctctcdn.com/js/signup-form-widget/current/signup-form-widget.min.js" async defer></script>
<?php 
}

add_action('wp_footer','custom_script');

Hope this helps!

[bullseye_surplus]

Thank you, that works!

[mldarshana]

You’re welcome