Adding javascript code above body tag

Hello everyone.

I’m trying to insert a javascript code right before the tag. I have tried to use a plugin that allows me to set the priority. However, in spite of using 1000 priority, there are still scripts that are below it. For now, I need to where and how (which theme file) I can inject this piece of javascript so that it is the closest to the tag. This is just to determine if this code will work at all.

Although, if someone does have a suggestion on how I can permanently put this code without it being superseded by another script, I would appreciate it!

The script that seems to hold the lowest spot, from what I can see has the priority set to 1000, which after I adjusted in the plugin files, did nothing to change it. I’m wondering if changing the priority is not enough and one must dequeue it and then enqueue it. Obviously, I would rather not mess with plugin files.

Thanks in advance!

So I also tried the function below with a late priority and still, I can’t seem to get below a certain script. Can I add it directly to the template using a child theme?

add_action( ‘wp_footer’, ‘my_footer_scripts’, 9999 );
function my_footer_scripts(){
?>

<?php }

Hello @kgpthemex,

Thanks for writing in!

For easier script management, I would highly recommend that you use “Insert Headers and Footers” plugin. This should allow you to insert custom JS in your header and footer of the page.

Adding the script directly to the template is not recommend as it may create issues in your site later on. You may use your PHP code instead:

add_action( 'wp_footer', 'my_footer_scripts', 9999 );
function my_footer_scripts(){
   // your script here
?>

<?php }

If the priority is not working, you may need to dequeue and enqueue the script if necessary.

Hope this helps.

@ruenel,

Thank you for getting back to me.

I understand that adding the script directly to the template won’t be a good solution however, I need to know if the script in question is going to work at all. Can you still tell me how and where for testing purposes?

I used the technique you mentioned but even with the priority of 9999, I can’t go below the script I’m trying pass. This plugin has somehow managed to keep its script at the very bottom.

The plugin in question is Tidio chat.

Thanks

Hi @kgpthemex,

The most thing that you can do is using the Child Theme and the code that my colleague mentioned. Please kindly consider that we do not know about the script you are using and that is something you need to contact the script developer and ask them to check.

If you want to know the code my colleague mentioned works or not you can use the code below which shows a simple Alert box to the screen. If it shows then the script is indeed added.

add_action( 'wp_footer', 'my_footer_scripts', 9999 );
function my_footer_scripts(){
   <script>alert('hello!');</script>
?>

<?php }

One additional point is that I have never seen a script not working merely because another script is loaded after it unless the script is dependant on that. If not, then most probably the script itself is not working.

Thank you for your understanding.

Hi @christopher,

Thank you for your input. As I mentioned, I have been able to use the script using the method you and @ruenel mentioned. However, I can’t seem to achieve what I’m trying to do with this method. The script is below. There is a dependency, so I have been told. It’s a simple script that simulates a click on another element. But from what I have been told, this script has to go below the tidio plugin script that’s loaded on the page. I don’t know if this is true so I wanted to manually place the script before the tag in the template file to know for sure. I won’t be depending on this as @ruenel pointed out, it’s going to cause problems in the future.

jQuery(document).on(“click”, “li#menu-item-608”, function ( $ ) {
jQuery("#button-body").click()
});

Hello @kgpthemex,

Could you please update the code and use this:

(function($){
	$(document).on("click touchstart", "li#menu-item-608", function () {
		$("#button-body").trigger("click");
	});
})(jQuery);

If nothing is helping, provide us access to your site so that we can check your settings. Please create a secure note with the following info:
– Link to your site
– WordPress Admin username / password

To know how to create a secure note, please check this out: https://theme.co/apex/forum/t/how-to-get-support/288

Regards.

@ruenel,

Thank you so much for providing the code. Unfortunately, it did not work. I appreciate you looking into it.

The idea is to use a nav item to trigger the tidio chat sidebar button. I was told that priority is important here but I have no idea how to get below that script. I have added the site information.

Thanks again.

Hello @kgpthemex,

I have inspected the page and I found out that you are trying to trigger the Tidio chat on the sidebar. The problem is that not any of the tidio elements appears when you inspect the page using View Source. If you inspect the page, the ID you are trying to use were loaded from an iframe. Even if you get the correct JS code for the menu item, please be aware that you cannot access any of the elements from an iframe because all of the contents of the iframe were coming from a 3rd party site.

As you can see, you can use this code to target the menu item properly:

(function($){
	$("#menu-item-608 a").on("click touchstart", function () {
		alert("You have click the menu item");
	});
})(jQuery);

Your big problem is that you cannot use this: $("#button-body").trigger("click"); because the button-body element is not access within your page. It is from inside of the iframe. I would highly recommend that you contact the creators of Tidio Chat instead. They should be able to get you a concrete solution to what you have in mind.

Thank you for your understanding.

1 Like

@ruenel, thank you for putting the effort in getting to the bottom of this.

I had a suspicion that the iframe was the reason why it would not work. Looks like my suspicions were correct. But I hoped I was wrong!

I was really hoping it could work but no big deal.

You guys have the best support.

Stay well!

Thanks for the kind words, @kgpthemex.

Stay safe and healthy!

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.