Ask your WordPress questions! Pay money and get answers fast! Comodo Trusted Site Seal
Official PayPal Seal

Jqeury Conflict WordPress

  • SOLVED

Hi,

I have installed a slider on the front page of my site however it's conflicting with Shopp (an ecommerce plugin) - the Jquery I think. When I deactivated the plugin my slider works. The Jquery I use for the slider is:

<script type="text/javascript" src="http://code.jquery.com/jquery-latest.js"></script>

The plugin however puts this in:

<script type='text/javascript' src='http://bathroomcladdingdirect.com/wp-includes/js/jquery/jquery.js?ver=1.6.1'></script>

And I think that's causing the problem.

Can I use the wp_enqueue_script and if so how do I load it in properly so both my slider and Shopp plugin works? I've looked in the docs but I don't fully understand it.

Cheers,
Steve

Answers (4)

2011-08-21

Peter Michael answers:

URL?


Peter Michael comments:

It's bathroomcladdingdirect.com I guess?


Steven Jones comments:

Yep.


Peter Michael comments:

Sent you a PM.

2011-08-21

Navjot Singh answers:

Use something like this:


function abcd_script_init() {
if (!is_admin()) {
wp_deregister_script( 'jquery' );
wp_register_script( 'jquery', 'http://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js', false, '1.6.1');
wp_enqueue_script( 'jquery' );
wp_enqueue_script( '<slider file name without js>', '<path to your slider js file>', array( 'jquery'), '<silder version no>' );
}
}
add_action( 'after_setup_theme', 'abcd_script_init' );


You can use wp_enqueue_script to load any number of javascript files now which depend on jquery or even otherwise. Read more about wp_enqueue_script at [[LINK href="http://codex.wordpress.org/Function_Reference/wp_enqueue_script"]]Codex[[/LINK]].


Steven Jones comments:

Was looking for a solution rather than advice. Also a further explanation of the code would be ideal.


Navjot Singh comments:

Without looking into which slider you are using or the actual site, exact solution can't be given. Your site just points us to a coming soon page which is not hosted on Wordpress.

Regarding the code, it first deregisters the jquery loaded by wordpress [http://bathroomcladdingdirect.com/wp-includes/js/jquery/jquery.js] and loads the jquery from Google code. Its faster this way. Next it loads the slider javascript and tells wordpress that it is dependent on jquery. The code executes only on the frontend for which is_admin conditional is loaded. And the whole query is loaded after Wordpress loads the theme. This whole code goes into your theme's function.php.

2011-08-21

Romel Apuya answers:

why not use jQuery.noConflict?

so you can use jQuery library without problems.

so your code would be


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

<?php wp_head(); ?>
<script type="text/javascript" src="http://code.jquery.com/jquery-latest.js"></script>
<script type="text/javascript">
var $j = jQuery.noConflict();

$j(function(){

//your jquery slider call here
// just replace $ with $j in your jQUery slider call

});

</script>

2011-08-21

Clifford P answers:

Navjot and Romel are correct that you need to load jQuery in no conflict mode, which WordPress does for you, if you add the javascript/jQuery correctly. Based on how you worded your question, I'm guessing this slider isn't a WordPress plugin. If you PM me your FTP login information and the URL of the page it is viewable on (also include WP login location and account info if URL of page is only available to logged in users), I could do it for you.