Skip to content
Home Blog Web Design How to use jQuery in WordPress

How to use jQuery in WordPress

  • Web Design
Blueprint Digital
Blueprint Digital

Insights from the Blueprint Digital team.

jQuery is a JavaScript library that is widely used in front end development today. jQuery is popular because it works with all major browsers and simplifies client-side scripting. jQuery also works in smartphones and tablets as opposed to Flash, which isn’t supported. jQuery enables some cool features such as slideshows and carousels, which are commonly found on the home page of a website.

WP Enqueue Script

Did you know jQuery is already included in WordPress? All you have to do is use a WordPress function, wp_enqueue_script().

<?php wp_enqueue_script('jquery'); ?>

The above code will include jQuery in your WordPress website. You could place the code above <?php wp_head(); ?> in header.php.

Including jQuery in your WordPress site

jQuery, and all JavaScript, should really be placed in the footer of a web page, if possible, because that is a good practice for improving page load time. The standard format for jQuery is as follows:

<script>
    $('#foo')...
<script>

However, because WordPress also comes with other libraries, jQuery is in a “no conflict” mode, which means jQuery has to be included like this:

<script>
    jQuery('#foo')...
<script>

jQuery noConflict wrapper

There is a problem though. Using ‘jQuery’ throughout instead of ‘$’ is cumbersome and makes the size of the script larger, making the page load slower. So what could be done to prevent that is to put the jQuery in a noConflict wrapper. If you are including jQuery in the footer, then this would be the format you use to include jQuery in a noConflict wrapper:

(function($) {
    $('#foo')...
})(jQuery);

Sometimes, it’s not always possible to include jQuery in the footer. If you are including jQuery in the <head>, then you could do this instead to put jQuery in a noConflict wrapper:

jQuery(document).ready(function($) {
    $('#foo')...
});

Conclusion

jQuery is really cool to use in your web development project. Now you know how to use jQuery properly in WordPress! For more information, you could read the WordPress Codex on this topic.

Ready to Dominate Online and Grow Your Business?

Schedule time to connect with Blueprint about your online goals, or request a free review of marketing campaigns.

Related Posts

Food & Beverage Marketing: How Ingredient Buyers Decide

Food & Beverage Marketing: How Ingredient Buyers Decide

Choosing an ingredient supplier is one of the higher-stakes decisions a food or beverage company makes. It runs through several people over a cycle that can stretch for months, and the deciding factor is usually how much risk each option carries for a business that cannot afford a line stoppage or a recall. For marketing[...]
How to Build a B2B Lead Nurturing Program That Closes Deals

How to Build a B2B Lead Nurturing Program That Closes Deals

Most B2B marketing teams are better at generating leads than keeping them warm. A form gets filled out, the lead lands in the CRM, and nothing happens until a salesperson gets around to it, by which point the buyer has moved on or gone quiet. In a market where the average deal takes months of[...]
How We Took the Grind Out of Link Building Prospecting

How We Took the Grind Out of Link Building Prospecting

Most link building programs stall at the same point, the prospecting spreadsheet. Finding sites worth pitching means pulling competitor backlinks, cross-checking them against what you already know, throwing out the junk, and judging what's left for relevance and quality. It's a few hours of repetitive work before a single outreach email gets written, and when[...]
Previous
Next

Partner with BLUEPRINT to reach your online goals, grow your business and reshape your story.

Get in touch with BLUEPRINT

Reach out to request a discovery call, a free campaign review, or for all other inquiries.

Subscribe to our newsletter