10 Must Have jQuery Plugins For Bloggers

Blogging is the window to your creativity and intellect. Blogs must and need to have a great design and UI to bring in a great viewer experience. There are wonderful jQuery plugins that can add amazing style and user experience to blogs. This is a collection of the must have jQuery plugins for bloggers that consist of image galleries, sliders, carousels, amazing menus, scrollers and lightbox. Spice upu your blogs with a great flavor of style and usability with these jQuery plugins for bloggers.

1. jQuery Owl Carousel

Owl Carousel is a touch enabled jQuery plugin that lets you create beautiful responsive carousel slider. Amazing features of Owl Carouse include, Responsive, Touch Events, Mouse Slide Events, Fully customizable, Choose the number of items to be displayed, Multiple Sliders, CSS3 3d Transitions, customizable controls, JSON, Custom events, Helpful callbacks and much more.  Setting up and using Owl Carousel is extremely easy. To use Owl Carousel, you’ll need to make sure both the Owl and jQuery 1.7 or higher scripts are included. You don't need any special markup. All you need is to wrap your divs(owl works with any type element) inside the container element <div class="owl-carousel">. Class "owl-carousel" is mandatory to apply proper styles that come from owl.carousel.css file.

2. Excolo Slider

Excolo Slider is a simple jquery sliding plugin, supporting responsive design and touch. Amazing features of Excolo Slider include, AutoPlay Slideshow, Mouse slide navigation, Prev/next button navigation, HTML5 data-attribute captions, Pagination, Repeat when last slide is reached, Play the slideshow backwards, Auto adjust size initially and on browser resize, for responsive designs, Touch enabled (limited to a few browsers), Can be molded into beauty using CSS, Most of these features can be configured and turned off, when setting up the slider. This plugin is extremely easy to configure ans use. The plugin looks for these images in the folder called Images relative to the page where the plugin is used. The name and location of these image files can be changed using the plugin options.

3. jVanilla Menu

jVanilla is a Lightweight and simple jQuery menu for everyone. This is a jQuery plugin that takes an existing pure CSS drop-down menu (so it degrades gracefully without JavaScript) and adds the enhancements like animations when showing submenus, support one submenu level, timed delay on mouseout, top level menu links can be inactive (on hover effect), last submenu right-aligned and much more. It is easy to use and extremely easy to adapt with your project.

4. Visual LightBox

Visual LightBox is a free wizard app that helps you easily generate popup image galleries with a terrific lightbox overlay effect, in a few clicks without writing a single line of code. Just drag&drop your photos into Visual LightBox window, press "Publish" and your own picture slideshow with beautiful lightbox effects will open in the browser instantly! No javascript,css,html coding, no image editing, just a click to get your gallery ready. Responsive, mobile-ready, unobtrusive, search engine friendly and yes even translated to 31 languages!

5. Squishy

Squishy is a jQuery plugin that automatically resizes text to exactly fit the container with no extra work on your part. You get it to work by linking the script file and including a simple declaration in your HTML. You can pass the script a number of options to restrict the squishiness. maxSize is used to set the maximum font size, minSize is used to set the minimum font size, maxWidth sets the maximum width of the line of text, and minWidth, the minimum (all in pixels, for now). These are enclosed in curly braces and passed to the function.

6. Instapixel jQuery Plugin

Instapixel is a jQuery plugin that will pixelate an image to an HTML5 canvas element at a given size. Maybe use it to generate high-res abstract art, or what about a resolution-neutral design element or perhaps as a tool to create baseline 2D art assets for 8-bit style games. Your call, friend! The plugin is extremely simple to use, just a simple call to the plugin function with the image parameter and yes its done! The plugin is stateful too and hence avoids repetitive calls.

7. jQuery Responsive Lazy Loader

This is a responsive lazy loader powered by jQuery, that loads image rendition according to CSS display & breakpoint. Responsive lazy loader allows you lo load the most appropriate image renditions according to the current breakpoint and to the current display into the CSS grid-system. It can be used as a simple lazy loader, simply as a responsive lazy loader (taking care of the breakpoint) or as an advanced lazy loader taking care of breakpoint and display.  The lazy loader recognizes the current display (size in a grid system for example) and breakpoint (mediaquery) and replaces a token in the image URL. It works with any HTML/CSS structure/framework as bootstrap or foundation and any image provider as Flickr or CMS using image preset (rendition, styles, ...) as Adobe CQ or Drupal. The plugin is only 3Ko (minified).

8. jQuery Imagefit

jQuery Imagefit is a simple, lightweight plugin to make images fit anywhere and anyway. Using the jQuery Imagefit plugin involves including the required script files of jQuery and jQuery Imagefit and then identifying the elements to be affected. Then finally set the ImageFit in the window load event. If you detect visual flips or white margins then try doing it in both, the 'document ready' and the 'window load' events. There might be more accurate methods depending on how you apply the plugin!

9. SlipHover

SlipHover is an amazing Hover effects for images plugin! Create attractive 2D and 3D Hover animation effects to images with the SlipHover plugin! SlipHover jQuery Image Hover effects plugin is not just simple to use and integrate but very easy to customize too. Using the plugin simply involves including jQuery and the plugin file on the website and then invoking the SlipHover plugin on the container that contains the images. That's it, SlipHover now lets introduce amazing Hover effects!

10. Radiant Scroller jQuery plugin

Radiant Scroller jQuery plugin is a jQuery plugin that allows to create responsive scrollers (carousels) with grid and simple horizontal layouts. RadiantScroller can be cuztomized with the variety of options and some API methods are also available. Using the Radiant Scroller jQuery plugin is simple too, just integrate the required files along with jquery.radiant_scroller-min.js and jquery.radiant_scroller.css and then set up basic layout for the scroller!