treehouse : what would you like to learn today?
Web Design Web Development iOS Development

jquery and Wordpress

  • Hi.
    I have been trying to get jquery to work on my custom worpdress theme and i cant get it to work..
    I know you have to use the wp_enqueue_script() to call the jquery library and to replace the $()”, with jQuery() .

    Im trying to get an image slider to show some of my work on and it just wont work..

    Anyone have any ideas? Or any good sites with info/tutorials on?

    Thanks,

    Joe
  • I usually just stick my scripts in header.php. wp_enqueue_script is too fiddly.
    <script type=\"text/javascript\" src=\"<?php bloginfo('template_url') ?>/js/jquery-1.3.2.min.js\"></script>
  • dave does it my way.... lol
  • Maybe i'm wrong but as far as i know jQuery is already "included" bij Wordpress so it's already declared.

    I had problems with a slider jquery library. And I solved it by putting the wp_enqueue_script in the header just before wp_head and the script itself just below wp_head.

    I have no idea why but that was the only way i got it working
  • yup a recent lib version is included, although im not sure if you need to add it to your head or if its done for you :)
  • Hi..
    Thanks you for getting back to me..
    Ill keep trying and let you know if the above works!
  • I always use the google hosted version of jQuery.

    Here is a screencast about building a jQuery slider into Wordpress http://blog.themeforest.net/wordpress/wordpress-for-designers-day-15/
  • I had a problem getting a smooth scroll effect using jQuery to work, and eventually found a fix that worked:

    jQuery.noConflict();

    // Put all your code in your document ready area
    jQuery(document).ready(function($){
    // Do jQuery stuff using $

    $.localScroll();
    $.localScroll.hash()

    });


    Whereas $.localScroll() and $.localScroll.hash() activate the scrolly effect everywhere on the page.

    However I think .noConflict() can cause some conflicts with other libraries with $ object models, so be careful! If someone could enlighten me to why that is or if there's a better way than .noConflict(), let me know at http://twitter.com/WebDojo.

    So in the end I used a plugin called HeadSpace to include my localScroll and scrollTo files, and a last file I named smooth-scroll-activate.js that included the code you see above.

    And voila! Drunken pirate coding.