If you use custom jQuery or JavaScript anywhere on your site then this plugin will save you a HUGE amount of time and effort! Enter custom JavaScript/jQuery code via beautiful syntax highlighted code editors.

The JavaScript editor even has basic built-in debugger!

Plugin Features

• Add jQuery UI widgets, effects, and interactions in seconds
• Separate JavaScript/jQuery and CSS code editors
• JavaScript/jQuery code editor includes built-in debugger!
• Library of 34 ready-made jQuery UI templates included
• 24 beautiful jQuery UI themes
• Very flexible solution for adding jQuery UI to your site

To add jQuery UI Widgets, effect, and interactions to your site header simply select the required scripts via drop down boxes and the plugin will do the rest.

You can then enter custom JavaScript, jQuery, or CSS code via dedicated code editors, which can be added to ALL pages or just a single specific page. YOU have complete control!

Choose Your jQuery UI Scripts

In plugin settings select which jQuery UI scripts you want to be included in your site header.

Select one or more scripts from each list box as required. These will be added to the front end of your site on every page. Click the ‘Select All’ buttons to select every script for a particular list box.

Adding Custom Code and Styles

Enter custom JavaScript/jQuery and CSS, via the code editors, to initialize your jQuery UI widgets, and add effects and interactions etc.

You can insert ready-made jQuery UI templates via the drop down box to the bottom right of the ‘Custom jQuery Code’ editor. There are 34 templates included with the plugin covering every available jQuery UI widget, effect, and interaction.

To the bottom left of the editor are buttons to clear the editor content and insert the default jQuery wrapper to save you having to keep entering it manually.

24 Beautiful Themes to Choose From

There are well over twenty themes included with the plugin to display jQuery UI widgets exactly how you want to.

Chances are you’ll be able to find a jQuery UI theme to match your existing website. However, you have the choice via advanced theme options to specify a custom jQuery UI theme which allows you to tweak any existing theme or create an entirely new one that will match your WordPress site perfectly!

Targeting Specific Pages

By default the jQuery UI widgets, effects, and interactions (plus custom code) specified on plugin options page are added to EVERY page on your site. This is ideal if you want to add items to the header, footer, or sidebar which are typically displayed on every page.

However, if you have a specific page (perhaps a landing page) that requires certain custom scripts and code for that page ONLY then it isn’t a good idea to include this on every page. Not only is it inefficient but it increases the risk of conflicts in your scripts.

To solve this problem jQuery UI Widgets Pro allows you to specify scripts and custom code on specific pages. Simply go to any post or page editor and scroll down until you see the “jQuery UI Widgets Pro” meta box. This contains very similar controls to the plugin options page.

Specify the scripts you want to include, just like you did before, plus any custom JavaScript/jQuery and CSS. That’s it! You now have all your scripts and custom code neatly wrapped up and included on a specific page.

Adding Custom Code ONLY

It’s worth mentioning that even if you don’t want or need to add jQuery UI widgets, effect, and interactions to a page you can still use the JavaScript/jQuery and CSS code editors to add custom code.

This could be any general code or styling that you want to apply globally (via theme options), or on specific pages (via the post editor). The plugin is flexible enough to allow you to do this without the overhead of including unnecessary scripts, which would be redundant if your custom code doesn’t reference them.

For plugin setup details check out the documentation. And if you need more information please contact us here for pre-sales questions. We’d love to hear from you.