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

How to use jQuery in WordPress

  • Web Design
Blueprint Digital

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

Full-Funnel Paid Media Strategy: Moving Beyond Last-Click Thinking

Full-Funnel Paid Media Strategy: Moving Beyond Last-Click Thinking

If you’ve ever cut spend from a prospecting campaign because it "wasn’t converting," only to watch your retargeting CPAs climb three weeks later, you’ve experienced the most expensive lesson in paid media. You didn’t cut waste. You cut the thing that was feeding your pipeline. This is the trap that last-click attribution sets for paid[...]
AI Content and SEO: How Content Inflation Is Reshaping Search

AI Content and SEO: How Content Inflation Is Reshaping Search

Every SEO I talk to right now is carrying some version of the same worry: that the thing we spent careers getting good at just got automated, and that we're now competing against software that drafts passable AI-generated content in nine seconds. I felt it too. For about a year I framed the whole shift[...]
Client Onboarding Process: The Key to Long-Term Revenue Growth

Client Onboarding Process: The Key to Long-Term Revenue Growth

A client relationship can feel clear, confident, and energized from the start, or it can feel scattered before the real work even begins. That difference often comes down to onboarding. The first 30 to 60 days shape how quickly clients trust your team, understand the strategy, and see where the work is headed. They are[...]
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