Using the Elementor Code Module
To start off, login to your WordPress admin dashboard and navigate to Plugins > Add New. Search for and install your desired plugin before activating it afterwards.
Once Elementor is installed, navigate to a page you would like to edit with Elementor and click “Edit with Elementor” from the left-sidebar. Next, search for and drag HTML widget into place where you wish to insert JS script code snippet. When finished copy/paste your code into widget and update. Upon returning to page check JS script is working properly before revisiting page/post for verification. This method works best if only needing one script on single page/post.
Using a Child Theme
Child themes provide an effective alternative to editing an existing WordPress theme, enabling you to add functionality without altering its structure and contents, as well as protect it against possible updates to themes and plugins.
Elementor provides two methods for creating child themes for websites: through its theme editor or FTP. The former requires only editing one function in your child theme’s functions file while FTP/SFTP connect will need to be used for this step.
Once your child theme has been successfully created, it is recommended that its stylesheet be added back in so your modifications take effect. Be careful with this step though as if not done properly your changes may not show up online.
One way to quickly load the stylesheet of a child theme is with the help of WordPress’s wp_register_style and wp_register_script functions, with the former registering your theme while the latter ensures it loads ahead of its parent theme’s. You can find more information on these functions by viewing their official documentation or use an add-on such as wpCode that provides access to a library of premade code snippets.
Using a Plugin
One way is to use a plugin that lets you insert code snippets quickly and easily into the header, footer or body of your website. WPCode offers such functionality with its vast library of premade snippets for adding code snippets directly into posts or pages – giving you greater control over when to load these components.
Another option is the Header Footer Code Manager plugin. Similar to WPCode, but offering more customization features; for instance, setting custom names/handles for the snippet and specifying whether it should appear in either head or body sections of a page is possible here; you can also define version numbers and manage dependencies associated with JS handlers.
Using a Widget
Website owners don’t have to be web designers in order to craft stunning websites; with page builders such as Elementor, any person can craft eye-catching pages that set their online business apart from its competition.
Once your plugin is created, you can use it to easily insert any jQuery code into your website. Priority options range from 1-10 and you can set whether or not it should appear on either the head> or body> page.