On their own, jQuery and WordPress both offer amazing results and uses for building websites, but together, they're pretty much unstoppable. When used properly, jQuery can compliment WordPress in a way that provides a cleaner, more intuitive, and fun experience for the user.

So today we're going to go over some of the most used jQuery plugins for WordPress. We will also provide resources/tutorials on how to write your own jQuery codes for your WordPress powered site and we'll also be featuring some of the coolest WordPress powered blogs around the web that utilize jQuery. So sit back, grab a cup of coffee (or in my case, a "BFC" Monster energy drink) and enjoy the article.

Everybody knows the power of plugins for WordPress and the leverage they give you to control, edit, and adjust your site without much coding knowledge. We find it only fitting that the first thing we discuss here are the plugins that are powered by jQuery. Building your site with some jQuery power behind it gives off the added appeal that most static sites just do not have, which in the long run gives you the creative edge among your competition.

These types of plugins will not only give you added site design features, but they'll also allow you to interact with your visitors, allow your visitors to read your website in multiple languages and even warn those pesky ie6 users that they're viewing your site with an outdated browser. Below are ten of the best jquery powered plugins that cover a wide variety of uses.

Some examples

• jQuery Lazy Load Plugin Delay the loading of images until the visitor scrolls to them (helps page load time)
• jQuery Live Comment Preview Let your readers view what their comments will look like as they type it
• Snazzy Archives Build a really nice archives page for your visitors
• TinyMCE Advanced We'll just call this 'posting on steroids'
• WP Image Fit Instead of relying on css/xhtml to resize images, let jquery fit them into your post boxes for you automatically
• Google Ajax Translation let your readers easily translate your content with the click of a button
• Quick Search adds dropdown results under search box as the user types
• Comment Validation Validate the comments you receive to cut down on spam and nonsense
• WP Wall Allow your readers to post comments in your sidebar and have them instantly show up
• Shockingly big ie6 warning Let your viewers know if they're using IE6 and that you don't support it!

The above are all fine options, but what about those of us who have some coding knowledge and don't want to actually depend on plugins to do the 'dirty work' for them? Well, we've got you covered too. Below are some links and information on utilizing jQuery with your WordPress powered website that will take you from beginner to advanced jQuery coder in the matter of days.

If you haven't had much experience with jQuery codes, don't worry - these tutorials are awesome and will help you step by step. I knew very, very little about jQuery a couple months ago. After diving into tutorials like the ones below, I can now work with tutorials, edit pre-existing codes and even write a bit of custom jQuery codes myself. So, trust me when I tell you that these tutorials will definitely come in handy for you.

Some examples

• Including jQuery in wordpress (the right way)
• How to highlight search terms with jQuery
• Implement a nice clean jquery sliding panel in wordpress
• How to create tabs (like domtabs) using jQuery
• Create a jQuery carousel with your wordpress posts
• Display a random post (with ajax refresh)
• Twitter news ticker for wordpress
• Wordpress multi-level drop down menu using wordpress
• Show/Hide toggle a widget using jQuery
• Adding form validation to wordpress comments using jQuery

And now for the part of the article where the visual learners will be happy - the picture portion :) Below are images (and links) to 10 WordPress powered blogs that integrate nicely with jQuery. With everything from a simple ul tab to tool tip hovers and even more complex codes, these websites show you exactly how much can be done with jQuery + WordPress.

Some examples

CSS-Tricks

PSD to WP

Blog & Blog

WP Inspiration

Creattica Daily

David Hellman

Elliot Jay Stocks

Kulterbanause

Icon Dock

Agnarson

Advertisement