Peter Raschendorfer

<p>The Smart JavaScript Auto Loader Plugin allows you to load additional JavaScript files without the need to change files in the theme directory</p>
<h3>Retired Plugin</h3>
<p>Development, maintenance and support of this plugin has been retired in october 2023. You can use this plugin as long as is works for you.</p>
<p>There will be no more updates and I won’t answer any support questions. Thanks for your understanding.</p>
<p>Feel free to fork this plugin.</p>
<h3>Usage</h3>
<p>To load additional JavaScript files just put them into a directory named <strong>jsautoload</strong>. This directory can be placed in three different locations that are loaded in the following order:</p>
<ul>
<li>Child Theme dependent (if using a Child Theme) : in the Child Theme’s directory</li>
<li>Theme dependent : in the Theme’s directory</li>
<li>Theme independent : in the wp-content directory</li>
</ul>
<p>Only files with extension .js are added, all other files are ignored. Subdirectories can be used and will also be scanned. To ignore a complete directory (including all subdirectories) name the directory beginning with an underscore (_). The files are added in alphabetical order. Directories always are added <strong>after</strong> files.</p>
<p>To load one ore more JavaScript files at the end of your HTML file just place them into a directory named <strong>footer</strong>. To add the files to the footer of your theme it is required to call wp_footer() in your footer.php.</p>
<h3>Plugin Privacy Information</h3>
<ul>
<li>This plugin does not set cookies</li>
<li>This plugin does not collect or store any data</li>
<li>This plugin does not send any data to external servers</li>
</ul>


Smart JavaScript Auto Loader

Really simple and good way to load additional JS, good job!



Simple and effective

Per Søderlind

Juliette Reinders Folmer

<p>We all know that when we’re add a script or style to WordPress, we should use <code>wp_enqueue_script( $handle, $src, $deps, $ver, $in_footer )</code> and <code>wp_enqueue_style( $handle, $src, $deps, $ver, $media )</code> as in:</p>
<pre><code>function themeslug_enqueue_style() {
    wp_enqueue_style( 'core', 'style.css', array('twentytwelve-style') );
}

function themeslug_enqueue_script() {
    wp_enqueue_script( 'my-js', 'filename.js', array('jquery') );
}

add_action( 'wp_enqueue_scripts', 'themeslug_enqueue_style' );
add_action( 'wp_enqueue_scripts', 'themeslug_enqueue_script' )
</code></pre>
<p>$deps (dependencies), the handle name and an optional parameter, lets you control when/where your script or style should be added. If $deps is <code>array('jquery')</code>, your script will be loaded after jquery is loaded.</p>
<p>The problem is, which one exists and in which order are they loaded ?</p>
<p>Debug Bar List Script & Style Dependencies, an add-on to <a href="https://wordpress.org/plugins/debug-bar/" rel="ugc">Debug Bar</a>, will list the dependencies.</p>
<h4>Use</h4>
<p>To view the loaded scripts and styles</p>
<ul>
<li>Front-end: Go to the front-end, and on the admin bar choose Debug and view Script & Style Dependencies</li>
<li>Back-end: Go to the back-end, on the admin bar choose Debug and view Script & Style Dependencies</li>
</ul>
<p>Note, the front-end and back-end loads different scripts and styles. Also, different pages on the front-end and back-end can load different scripts and styles.</p>


Debug Bar List Script & Style Dependencies

Style very useful (even if it has not been updated since two years) ! Thanks !



useful !

Debug Bar List Script & Style Dependencies is an add-on to WordPress Debug Bar

Smart JavaScript Auto Loader vs Debug Bar List Script & Style Dependencies