How to avoid having javascript in PHP file?

[351728283]

Select Topic Area

Question

GitHub Feature Area

Markdown

Body

I have a Wordpress plugin based on the Lightgallery Javascript plugin. Javascript is needed to initialize the javascript gallery, and different galleries can have different settings (which is defined in the JS that initalizes the gallery).

My code works, but it’s pretty messy having PHP and JS in the same file…

Here’s some example code from Lightgallery

[queenofcorgis]

Hey there! 👋

Thanks for posting in the GitHub Community, @351728283 ! We're happy you're here. You are more likely to get a useful response if you are posting your question in the applicable category. The Accessibility category is a place for our community to discuss and provide feedback on the digital accessibility of GitHub products. Digital accessibility means that GitHub tools, and technologies, are designed and developed so that people with disabilities can use them.

We’ve moved your post to our Programming Help 🧑‍💻 category, which is more appropriate for this type of discussion.

Please review our guidelines about the Programming Help category for more information.

[sergio-gn]

Since you are working with a plugin, you can enqueue the js script with a function. For example:

function enqueue_lightgallery_assets() {
wp_enqueue_script('lightgallery-js', plugin_dir_url(FILE) . 'js/lightgallery.min.js', array('jquery'), '1.0', true);
wp_enqueue_script('custom-gallery-init', plugin_dir_url(FILE) . 'js/custom-gallery-init.js', array('lightgallery-js'), '1.0', true);
}
add_action('wp_enqueue_scripts', 'enqueue_lightgallery_assets');

this way, when the plugin is active, this function will also be active.
By doing this you can edit the .js file in a separate folder of the plugin.