Object Oriented jQuery Plugin Boilerplate

I’ve been writing a ton of jQuery plugins lately and decided to create myself a nice little boilerplate with some common structures. This boilerplate will provide the necessary Object Oriented Class based setup for a plugin and its extension of the jQuery.fn Object.

Features of this Boilerplate:

  • Fully chainable plugin use
  • Object Oriented JavaScript structure
  • jQuery UI style syntax for running commands, reading properties
  • Automatic read of HTML5 data properties for default option overrides

Instantiate the plugin:

Initiate the plugin just like any other jQuery plugin and pass an option object to override default options.

Run plugin methods:

Easily run plugin methods by passing the method name to the plugin function.

Read options:

Read option values for a plugin instantiation with the option method. Pass the option value to read as the second argument.

Override default options with HTML5 data properties:

Easily deploy your plugin without having to write much custom JavaScript for elements that will have specific options settings by specifying the option as an HTML5 data property.

HTML:

JavaScript:

This plugin boilerplate is available free of use under the GPLv3 or compatible license.

Download the jQuery Plugin Boilerplate on GitHub

One Reply to “Object Oriented jQuery Plugin Boilerplate”

  1. Hey Dave,

    This looks awesome, and I’m really hoping I can use it for some of my projects eventually. Do you have any examples of projects that you’ve used this on? It would be very cool/helpful to see it in action.

Leave a Reply