Resolve JQuery Conflict in WordPress


WordPress began as a blogging framework, however it is used as full content management system. WordPress is developed on  HTML5, PHP,MySQL,Jquery , CSS . WordPress repository now contains wide variety of plugins  and themes.

WordPress Themes are ready-made layouts created for WordPress. Theses themes allow users to change the look and functionality of a WordPress website and they can be installed without altering the content of the site.WordPress themes are mainly classified into  free themes and premium themes.

Free themes are listed in the WordPress theme directory and premium themes can be purchased from marketplaces and individual WordPress developers.  Some fastest loading themes includes Wordpress twenty sixteen, Themeforest Avada and Enfold.

WordPress Plugins extending  the functionality of your wordpress site. Some of commonly used plugins include Contact Form 7, TinyMCE AdvancedNextGEN Gallery and Advanced Custom Fields.

JQuery in WordPress

Including JQuery in WordPress theme

Add the following to the theme’s functions.php file:

if (!is_admin()) add_action("wp_enqueue_scripts", "my_jquery_enqueue", 11);
function my_jquery_enqueue() {
   wp_register_script('jquery', "http" . ($_SERVER['SERVER_PORT'] == 443 ? "s" : "") . "://", false, null);

JQuery Issues in WordPress

Jquery is a widely used powerful javascript framework. When you are using the jquery in wordpress that time you need to keep in mind some issues. WordPress itself uses the jquery in their framework. But when we try to add  different versions of jquery and their plugins, this leads to some issues or conflict with wordpress core.

How to resolve JQuery Conflict in WordPress

WordPress itself uses the jquery in their framework. So you dont need to add the jquery script again in to wordpress. For removing the conflicts when you are using the jquery functions, just use the following no conflict code.

<script type="text/javascript">// <![CDATA[


 jQuery(document).ready(function($) {

 // Code that uses jQuery's $ can follow here.


 // Code that uses other library's $ can follow here.

// ]]></script>

if you are familiar with  jquery,  use the following code instead

var j = jQuery.noConflict();
// Do something with jQuery

j("div p").hide();
// Do something with another library's $()

$("content").style.display = 'none';



Morbits is One of the biggest and Proven Digital Marketing and Inbound Marketing Company from Kochi,Kerala. We undertake Web Development , Ecommerce , Mobile Apps, SEO, Server solutions , SMS,Newsletters, ORM and More since 2008

Leave a Reply

Your email address will not be published. Required fields are marked *