How to enqueue Scripts & Stylesheets to WordPress via a plugin

Taken from here: https://www.creare.co.uk/how-to-enqueue-scripts-stylesheets-to-wordpress-via-a-plugin

For that extra level of safety and control, we recommend enqueuing via a separate  dedicated plugin. In the video, I demonstrate how simple this is. Firstly, create a folder within WordPress’ plugin folder located at /wp-content/plugins/. Name your folder something useful like ‘theme-scripts’ and create a php file with the exact same name within (i.e theme-scripts.php). Then, simply add and customise the following code, as per our example.

<code><?php</code>
<div><code>/*</code></div>
<div><code>Plugin Name: James' WP Enqueue Scripts &amp; Styles</code></div>
<div><code>Plugin URI: <a href="http://www.creare.co.uk/">http://www.creare.co.uk/</a></code></div>
<div><code>Description: This is my own custom plugin for enqueuing Scripts and Styles in my WordPress theme</code></div>
<div><code>Version: 1.0</code></div>
<div><code>Author: James Bavington</code></div>
<div><code>Author URI: <a href="http://twitter.com/jamesbavington">http://twitter.com/jamesbavington</a></code></div>
<div><code>License: Help yourselves to the shelves</code></div>
<div><code>*/</code></div>
<div></div>
<div><code>function</code> <code>james_adds_to_the_head() {</code></div>
<div></div>
<div><code>    </code><code>//wp_enqueue_script('jquery');</code></div>
<div></div>
<div><code>    </code><code>wp_register_script( </code><code>'add-bx-js'</code><code>, get_template_directory_uri() . </code><code>'/jquery.bxslider/jquery.bxslider.min.js'</code><code>, </code><code>array</code><code>(</code><code>'jquery'</code><code>),</code><code>''</code><code>,true  );</code></div>
<div><code>    </code><code>wp_register_script( </code><code>'add-bx-custom-js'</code><code>, get_template_directory_uri() . </code><code>'/jquery.bxslider/custom.js'</code><code>, </code><code>''</code><code>, null,</code><code>''</code>  <code>);</code></div>
<div><code>    </code><code>wp_register_style( </code><code>'add-bx-css'</code><code>, get_template_directory_uri() . </code><code>'/jquery.bxslider/jquery.bxslider.css'</code><code>,</code><code>''</code><code>,</code><code>''</code><code>, </code><code>'screen'</code> <code>);</code></div>
<div></div>
<div><code>    </code><code>wp_enqueue_script( </code><code>'add-bx-js'</code> <code>);</code></div>
<div><code>    </code><code>wp_enqueue_script( </code><code>'add-bx-custom-js'</code> <code>);</code></div>
<div><code>    </code><code>wp_enqueue_style( </code><code>'add-bx-css'</code> <code>);</code></div>
<div></div>
<div><code>}</code></div>
<div></div>
<div><code>add_action( </code><code>'wp_enqueue_scripts'</code><code>, </code><code>'james_adds_to_the_head'</code> <code>);</code></div>

Revisions

Tags:

No comments yet.

Leave a Reply