Shadowbox JS Plugin

Shadowbox is an online media viewing application that supports all of the web’s most popular media publishing formats. Shadowbox is written entirely in JavaScript and CSS and is highly customizable. Using Shadowbox, website authors can display a wide assortment of media in all major browsers without navigating users away from the linking page.

This plugin uses Shadowbox written by Michael J. I. Jackson.

Javascript libraries supported are: None, YUI, Prototype, jQuery and MooTools. Prototype and jQuery are used from the Javascript libraries included with WordPress, YUI is loaded from Yahoo APIs and Mootools is loaded from Google APIs.

This plugin can also be used as a drop in lightbox replacement, without requiring you to edit posts already using lightbox.

By default this plugin will use Shadowbox for all image links, movie links, audio links and YouTube/Google Video links including those generated by the [gallery] shortcode.

Shadowbox is licensed under the terms of the Shadowbox.js License. This license grants personal, non-commercial users the right to use Shadowbox without paying a fee. It also provides an option for users who wish to use Shadowbox for commercial purposes. You are encouraged to review the terms of the license before using Shadowbox. If you would like to use Shadowbox for commercial purposes, you can purchase a license from http://www.shadowbox-js.com/.

This plugin also makes use of the JW FLV Player. JW FLV Player is licensed under the terms of the Creative Commons Attribution-Noncommercial-Share Alike 3.0 Unported License. If you would like to use JW FLV Player for commercial purposes, you can purchase a license from https://www.longtailvideo.com/players/order2.

Neither Shadowbox nor the JW FLV Player are actually included in this plugin. The plugin will ask you to download these files after installation and activation.

Please use the Shadowbox JS support forum for problems or questions with this plugin. Support questions will be ignored if left as comments on my site, through my contact form or by email. The only supported location for support questions is https://wordpress.org/tags/shadowbox-js.

This plugin is absolutely not supported when used in combination with the Thesis theme. Please do not ask for support if you are using such a configuration.

Upgrade

1. Use the plugin updater in WordPress or…
2. Deactivate the Shadowbox JS plugin
3. Delete the previous shadowbox-js folder from the /wp-content/plugins/ directory
4. Upload the new shadowbox-js folder to the /wp-content/plugins/ directory
5. Activate the Shadowbox JS plugin
6. Visit the settings page in the WordPress admin at Settings -> Shadowbox JS and install the required dependencies if needed

Usage

1. By default this plugin will add the activator attribute to all image links, movie links, audio links and YouTube/Google Video links that do not already have the activator attribute. Meaning basically, by default all images in the posts on your site will automatically be displayed using Shadowbox.

If you want more fine grain control over the links continue with the next steps. If not then stop here.

1. Create a link in your post in the following format (This link can be to pretty much anything including websites, video files, YouTube, Google Video and inline content):

<a href="http://domain.tld/directory/to/image.jpg" rel="shadowbox[album]">Image</a> 

2. Be sure to include rel="shadowbox" as this activates the plugin.
3. If rel="shadowbox[album]" is included the portion listed here as [album] will group multiple pictures into an album called album. Do not use [gallery] to define an album as WordPress has a shortcode that will interfere.
4. If you are using this as a lightbox replacement you do not need to change rel="lightbox" to rel="shadowbox". Shadowbox.js supports rel="lightbox" natively.
5. If you want to make a gallery/album and only want one link to display you can use class="hidden" to hide the additional links.
6. See http://shadowbox-js.com/doc/usage.html#markup for detailed markup instructions.
7. If you are using using Shadowbox globally for all images but have an image you do not wish to use Shadowbox on use rel="nobox" in your image link.

1. Upload the shadowbox-js folder to the /wp-content/plugins/ directory or install directly through the plugin installer
2. Activate the plugin through the ‘Plugins’ menu in WordPress or by using the link provided by the plugin installer
3. Visit the settings page in the Admin at Settings -> Shadowbox JS and install the required dependencies
4. Optional: Activate the ‘Shadowbox JS – Use Title from Image’ plugin to push the title from ‘img’ tags onto the parent ‘a’ tag

1. 

   An Image

2. 

   A Website

3. 

   A YouTube Video

Installation Instructions

1. Upload the shadowbox-js folder to the /wp-content/plugins/ directory or install directly through the plugin installer
2. Activate the plugin through the ‘Plugins’ menu in WordPress or by using the link provided by the plugin installer
3. Visit the settings page in the Admin at Settings -> Shadowbox JS and install the required dependencies
4. Optional: Activate the ‘Shadowbox JS – Use Title from Image’ plugin to push the title from ‘img’ tags onto the parent ‘a’ tag

What image file types will this plugin automatically add Shadowbox to?

bmp, gif, png, jpg, and jpeg

What movie file types will this plugin automatically add Shadowbox to?

swf, flv, f4v, dv, mov, moov, movie, mp4, asf, wm, wmv, avi, mpg and mpeg

What audio file types will this plugin automatically add Shadowbox to?

mp3 and aac

When I click on my YouTube links I see the full YouTube web site and not just my video. What is wrong?

You have probably used the wrong form of the YouTube URL. If you used something like http://www.youtube.com/watch?v=3D3kFn_3xRY that will disaply the YouTube website and not just the video. To just get the video use a link that looks like http://www.youtube.com/v/3D3kFn_3xRY.

How can I use a custom Shadowbox skin without having to worry about it being deleted during the upgrade process?

The first thing you will need to do is to download shadowbox.js source from the github repository: http://github.com/mjijackson/shadowbox/downloads

Second modify and build as required, then follow the next 2 FAQs for using a custom shadowbox.js and a custom shadowbox.css. I will not tell you how to build shadowbox, you can find that information in the source download.

You do not necessarily have to do both. It is possible to only load a custom markup or only a custom css.

I cannot seem to get the plugin to download the Shadowbox source. What can I do?

You can follow the steps outlined in the ‘How can I use my own shadowbox.js’ and ‘How can I use my own shadowbox.css?’ or you can manually download and extract as explained by the plugin.

I don’t want to downlaod the source from your site at all. How else can I get the source?

Follow the steps outlined in the ‘How can I use my own shadowbox.js’ and ‘How can I use my own shadowbox.css?’.

How can I use my own shadowbox.js?

Download or purchase Shadowbox from http://www.shadowbox-js.com/ and then…

This can be accomplished using filters. You will need to run a filter on ‘shadowbox-js’; and here is some sample code to show you how:

function custom_shadowbox_js($url) { return get_bloginfo('stylesheet_directory') . '/js/shadowbox.js'; } add_filter('shadowbox-js', 'custom_shadowbox_js'); 

Just drop that code, modifying to your needs, in a custom plugin or mu-plugin and enjoy.

How can I use my own shadowbox.css?

Just as above this can be accomplished using filters. You will need to run a filter on ‘shadowbox-css’; and here is some sample code to show you how:

function custom_shadowbox_css($url) { return get_bloginfo('stylesheet_directory') . '/css/shadowbox.css'; } add_filter('shadowbox-css', 'custom_shadowbox_css'); 

Just drop that code, modifying to your needs, in a custom plugin or mu-plugin and enjoy.

Can I selectively load Shadowbox on pages that need it?

Yes. However this functionality requires WordPress 2.8. If you are running WordPress 2.8 and you would like to enable this functionality visit Settings -> Shadowbox JS and set Enable Smart Loading to true.

Why isn’t this plugin working?

Check to make sure that you have <?php wp_head(); ?> in your themes header.php and <?php wp_footer(); ?> in your themes fotoer.php. See the default WordPress theme for examples. Also see the FAQ below.

This plugin has stopped working since I installed another plugin or another plugin has stopped working since I installed this plugin. What can I do?

Try changing the Javascript Library used by this plugin to something other than ‘None’ on the Shadowbox JS settings page in the WordPress admin.

Is this plugin really GPL?

The plugin itself is GPL, however Shadowbox and JW FLV Player are not GPL. Without the non GPL Shadowbox component, this plugin cannot function.

Shadowbox is licensed under the terms of the Shadowbox.js License. This license grants personal, non-commercial users the right to use Shadowbox without paying a fee. It also provides an option for users who wish to use Shadowbox for commercial purposes. You are encouraged to review the terms of the license before using Shadowbox. If you would like to use Shadowbox for commercial purposes, you can purchase a license from http://www.shadowbox-js.com/.▒

JW FLV Player is licensed under the terms of the Creative Commons Attribution-Noncommercial-Share Alike 3.0 Unported License. If you would like to use JW FLV Player for commercial purposes, you can purchase a license from https://www.longtailvideo.com/players/order2.▒

Neither Shadowbox nor the JW FLV Player are actually included in this plugin. The plugin will ask you to download these files after installation and activation.

3.0.3.10.2 (2012-04-20):

• Don’t assume that the uploads dir is wp-content/uploads, use wp_upload_dir to get the correct path. This only affects the meta box that informs users where they can manually place the files.

3.0.3.10.1 (2012-04-10):

• Update S.path in shadowbox to the new URL of where the source files are located
• Clear the missing files nag if the files were downloaded manually

3.0.3.10 (2012-03-13):

• Removed the upstream Shadowbox JS package from the plugin. As a result, this plugin has been updated to handle downloading the required files for use.

3.0.3.9 (2011-12-08):

• Updates to handle the script enqueueing in WordPress 3.3

3.0.3.8 (2011-06-08):

• Due to large reworkings script dependencies were not being loaded when a library other than ‘None’ was selected on the settings page

3.0.3.7 (2011-06-07):

• Missed a merge

3.0.3.6 (2011-06-07):

• Had to bump the version because I forgot to do so previsouly for 3.0.3.5 for the sub plugin, this should fix update notices

3.0.3.5 (2011-06-07):

• Update Javascript code comments to be safe with broken HTML minification processes
• Hook into the_content if Smart Loading is disabled instead of the_posts
• Better post id detection for gallery grouping

3.0.3.4 (2011-06-02):

• Make the Shadowbox ‘album’ names a little more unique to bypass a bug in the WordPress shortcode regex where a ‘-‘ is seen as the ending delimiter in a shortcode name

3.0.3.3 (2011-05-31):

• Create new escaping functions to get around problems with plugins and themes filtering the builtin escaping functions
• Make sure cached file is world readable before trying to enqueue it
• Add option to disable creating and using the cached shadowbox.js
• Code cleanups
• Hook into the_posts instead of the_content for easier determination if styles and scripts should be enqueued.
• Regular Expression enhancements
• Add option to not used the cached shadowbox.js and have it generate on page load

3.0.3.2 (2010-04-05):

• Replace missed wp_htmledit_pre functions in the options page

3.0.3.1 (2010-04-05):

• Replace wp_htmledit_pre with htmlspecialchars as it seems themes and plugins are adding output using it’s filter

3.0.3 (2010-04-03):

• Upgrade shadowbox.js to 3.0.3
• Graceful degredation when plugin PHP files are missing
• Remove custom upgrade notices in favor of the new built in functionality
• Separate out the plugin into additional files for better organization
• WordPress 2.8 minimum requirement
• Make sure options are not blank, if a user tries to update an option with nothing in the admin, revert to the default value
• Create a lot of filters so people can hook in and override things
• Add additional plugin to push the title from ‘img’ tags to ‘a’ tags
• Remove Dojo and Ext support

3.0.0.3 (2009-11-07):

• Fix empty options on activation for new installs

3.0.0.2 (2009-10-30):

• Update shadowbox.js build from upstream
• Add option to disable sizzle.js
• Enhance Upgrade Logic
• Add Dutch translation
• Update to not start anything until init at earliest
• Split FLV from Auto Movies so that we can force certain file types to use the FLV player
• Replace logic to use the video height and width for all videos by defualt, not just Youtube and Google Video

3.0.0.1 (2009-06-30):

• Bring back PHP4 support
• Increase speed by reducing the number of queries
• Code cleanup
• Add changelog output to upgrade notice in admin. Requires WordPress 2.8
• Do not display majority of the settings page form if the options have been removed from the database
• Fix broken localization directory name in code and update localization template
• Remove unused javascript files
• Add Russian translation

3.0.0.0 (2009-06-10):

• Updated Shadowbox to 3.0b1
• Code cleanup and optimization, will only load the code into memory that is needed
• Removed IE8 hack since Shadowbox 3.0 now supports IE8
• Added options to the admin page for modifying the default size of YouTube videos
• Full screen in YouTube videos is now supported
• Added options to the admin page for modifying flashVars, flashParams and minimum flash version required
• Added option to the admin page for disabling Shadowbox.setup so that Shadowbox.setup can be run from another script to allow image maps through area tags
• Disabled the FLV player by default since it has a non-commercial license. Must enable FLV player after accepting licensing in the admin
• Added capability for loading shadowbox only when needed. Requires WordPress 2.8.
• Added capability for only loading the shadowbox players you want.

2.0.4.1 (2009-03-24):

• Add IE8 support by way of the X-UA-Compatibile meta tag

2.0.4.0 (2009-03-18):

• Use domready events for javascript libraries other than None for intialization of shadowbox so that shadowbox works before the page is completely loaded
• Initial support for WordPress 2.8, more updates will finalized as WordPress 2.8 is finalized
• Bulgarian translation for shadowbox.js added
• Code cleanup
• Change default size for Youtube videos
• Add automation to the_excerpt so links in custom excerpts can utilize shadowbox
• Support for custom skins using a filter (see the FAQ)

2.0.3.3 (2009-01-23):

• Fix issue where replacement was trying to be done when no replacements were necessary
• Add feature to attempt to automatically set Shadowbox language based on defined WordPress language
• Only load the required javascript in the admin when on the shadowbox-js settings page
• Clean up code

2.0.3.2 (2008-12-26):

• Fix animate and animateFade select options, were true/true, now true/false
• Fix PHP warnings about non-existent $_POST array indexes

2.0.3.1 (2008-12-23):

• Updated invalid php start tag

2.0.3.0 (2008-12-23):

• Added options page to admin interface
• Added support to automatically use Shadowbox for movie, audio and YouTube/Google Video links.

2.0.2.1 (2008-09-22):

• Fixed typo in variable name containing the previous rel attribute of the link

2.0.2 (2008-09-22):

• Added support to automatically use Shadowbox to display all images in your posts including those generated by the [gallery] shortcode.
• Added deactivator rel attribute. Use rel=”nobox” to not use Shadowbox to display an image when global activation is configured.

2.0.1 (2008-08-25):

• updated code for readability
• Added support for [gallery] shortcode

2.0 (2008-08-11):

• Updated shadowbox.js to version 2.0
• Added various options and changes to support shadowbox.js version 2.0
• Updated javascript library locations to use Google APIs and Yahoo APIs where applicable.
• Changed versioning of the plugin to match that of the shadowbox.js version

0.4 (2008-04-10):

• Updated to use assetURL for location to shadowbox files
• Cleaned up code and added extended comments
• Added extras.css with support for hidden class
• Added support to not include javascript libraries

0.3 (2008-02-26):

• Updated Shadowbox.js to version 1.0 Final
• Added support for Ext, Dojo and MooTools Javascript Libraries
• Removed lightbox2shadowbox function/filter as Shadowbox.js now natively supports rel=”lightbox”
• Consolidated repetitive code
• Removed images that were not in use
• Selected MooTools as the default as it contains the smallest payload

0.2 (2008-02-22):

• Initial Public Release