WP Supersized free WordPress plugin

WP Supersized allows you to display a resizable full screen background slideshow on pages/posts of your choice. After activation you will find a new WP Supersized section in your Settings where you can manage the plugin options. A WP Supersized panel will also be available in the post/page editor to select the source of images used by the plugin individually for the current post/page. Users may use images from NextGEN Gallery, the WordPress Media Gallery, Flickr, Picasa, Smugmug, their own choice of directory within the wp-content folder, or a list of slides defined in an xml file (for advanded users). WP Supersized integrates the Supersized jquery extension in the pages/posts of your choice. I am not the developer of the original Supersized jquery extension itself, Supersized was written by Sam Dunn. My plugin only integrates it into your theme and gives you easy access to many options for displaying this resizeable slideshow background where you want on your website or blog. So, what exactly does WP Supersized do? Cycles Images/backgrounds via slideshow with transitions and preloading (use it as background or as slideshow) Resizes images to fill browser while maintaining image dimension ratio Navigation controls with keyboard support Integration with NextGEN Gallery and with the WordPress Media Gallery – choose images from NextGEN galleries or attached to post/page Integration with Flickr – pull photos by user, set, tag, or group Integration with Picasa – pull photos by album, user,or tag Integration with Smugmug – pull photos by keyword, user, gallery, category Accepts jpg, gif, and png images Simple selection of your images source for each page/post separately (also options for advanced users, using an XML file) HTML and links can be used within the images captions (when using WP Media Gallery, NextGEN Gallery, or an XML file as source of images). You can see an example of Supersized in use in a WordPress page on the WP Supersized page or on my About page. For more details about Supersized itself and its development, check Supersized. WP Supersized allows you to display Supersized on the pages/posts that you want in your current theme. Many options are available to choose where and how it will be displayed. Options There is a number of available options, shown below with their default values. Not every option is functional in the Single image mode. WP Supersized also adds an additional option tab in the page/post editor for easy selection of the source of images for each post/page individually. A source selected on an individual page/post will override the general options choice. When no value has been set for these options yet, they use the general options. Functionality Type of background Determines which type of slideshow will be used. Slideshow: The images that you have uploaded to your /wp-content/supersized-slides/ directory or the ones attached to the post/page through the WordPress Media Gallery (have a look at the FAQ to find out how this works) will be shown. Single image: A single image will be used (the first one found in the slides folder if you have more than one). Slideshow controls will not appear in this mode. Flickr images: Images will be pulled from Flickr (by user, set, group, or tags see the Flickr options below). If you choose this, please be aware that not all Components options and none of the Supersized Shutter theme specific options will be available with the current version of Supersized. Autoplay on/off Determines whether the slideshow begins playing automatically when the page is loaded. Start on slide # The slide the slideshow starts on (default is 1). Slides are sorted in alphabetical order of their filename. In the Single image mode, it controls which image is loaded, 0 causes a random image to be loaded each time (assuming that you have several images in the /wp-content/supersized-slides/ directory). Random slides When on, slides are shown in a random order and the starting slide number will be disregarded. Default is off. Slide interval Time between slide changes in milliseconds. The default is 3 seconds. Transition Controls which effect is used to transition between slides. Options are as follows: No transition effect Fade effect (Default) Slide in from top Slide in from right Slide in from bottom Slide in from left Carousel from right to left Carousel from left to right Speed of transition The time transitions take in milliseconds (default is 500 milliseconds). New window Whether or not slide links open in a new window (default is on). Pause on hover Pauses the slideshow when the current image is hovered over. If navigation is enabled, the pause button will become active to show paused state. Disabled by default. Stop loop Pauses the slideshow upon reaching the last slide (default is off). Keyboard navigation Keyboard navigation (default is on). Spacebar pauses, Up/Right go to next slide, and Down/Left go to previous slide. Performance Uses image rendering options in Firefox and Internet Explorer to adjust image quality. This can speed up/slow down transitions. Webkit does not yet support these options. Normal – No adjustments Hybrid Speed/Quality – Lowers image quality during transitions and restores after completed (Default) Optimizes image quality Optimizes transition speed – Faster transition speed, lower image quality Image protection Disables right clicking and image dragging using Javascript (default is off). Background URL Type here the URL of the link you want to access when clicking on the background image (www.example.com). The same link will be used for all images. Leave this field empty if your do not want any link to be used. Default is empty. Display Select the page(s) where Supersized should be used Choose where you want to apply Supersized. These are the most general options. More precise selections are possible below. Everywhere (except admin pages) All pages (except homepage) Homepage (of your blog) Front page (landing page) Error page (404) Search results page All posts (not pages) Sticky post Category archive Tag archive Date archive Any archive From version 2.0, the option Only on posts/pages with custom field SupersizedDir has been removed. Any page/post that has an image source other than none will display Supersized. If you select All posts, All pages, or Everywhere, posts/pages with an image source other than none will show images from the corresponding folder while all others will show the default directory images. In each of these options, unless a specific image source was defined in the page/post, the default slides directory will be used. Select the page template(s) where Supersized should be used This option lists all available custom templates in the current theme. You may select one or several of them. The list is empty if your current theme does not use any custom template. Please reset the options when you change theme to make sure that the list is updated. Post ID where Supersized will be used Type here a comma-separated list of the post IDs where you want Supersized to appear. Don’t forget to deselect All posts or Sticky post above. You can find your post IDs in the Posts admin menu by hovering on the name of the post. The ID will be displayed at the bottom of your browser. Alternatively, you can use the WP Show IDs plugin. Page ID where Supersized will be used Type here a comma-separated list of the page IDs where you want Supersized to appear. Don’t forget to deselect All pages, Homepage, Front page, or Error page above. You can find your page IDs in the Pages admin menu by hovering on the name of the page. The ID will be displayed at the bottom of your browser. Alternatively, you can use the WP Show IDs plugin. Category ID for the posts/pages where Supersized will be used Type here a comma-separated list of the category IDs where you want Supersized to appear. You can find your Category IDs in the Posts > Categories admin menu by hovering on the name of the category. The ID will be displayed at the bottom of your browser. Alternatively, you can use the WP Show IDs plugin. Tag ID for the posts/pages where Supersized will be used Type here a comma-separated list of the tag IDs where you want Supersized to appear. You can find your Tag IDs in the Posts > Post Tags admin menu by hovering on the name of the tag. The ID will be displayed at the bottom of your browser. Alternatively, you can use the WP Show IDs plugin. Slides source Default slides directory Select here the slides directory that will be used by default (default is supersized-slides if it exists). Only folders are shown by the selector. Some folders such as plugins, themes, cache, and a few others are not shown by the selector. The images from the selected directory will be displayed by Supersized unless you use a custom directory in each post/page. Please put your images folders (default or custom) for Supersized in your wp-content directory. You may create folders within folders, e.g. /wp-content/supersized-slides/slidesforpost###/. If you have been using the SupersizedDir custom field in your pages/posts, it is still used but is now shown and selected with a selector. You do not need to fill the custom field yourself anymore. WP Supersized will look first for a custom images source that you would have set up for the current page/post. If not found, it will then use the default directory selected here (do not forget to create it and fill it with images!). If none of these can be found, the default Supersized images will be shown. Debugging mode on/off When on, WP Supersized will generate comments in the source of the web page (in the slides list) with some variables and arrays values, useful to find out the origin of file path problems. If you have problems with displaying your images, send me these comments from the source of the page and I will be able to help you more easily. This is not necessary for normal operation. Use only if you have trouble with displaying your images. (default is off) Size and position Minimum width allowed, Minimum height allowed Minimum dimensions the image is allowed to be. If either is met, the image won’t size down further (default is 0). Center the background vertically Centers image vertically. When turned off, the images resize/display from the top of the page (default is on). Center the background horizontally Centers image horizontally. When turned off, the images resize/display from the left of the page (default is on). Always fit Prevents the image from ever being cropped. Ignores minimum width and height. (default is off). Fit portrait Prevents the image from being cropped by locking it at 100% height (default is on). This will usually cause vertical images to not cover the window entirely. Fit landscape Prevents the image from being cropped by locking it at 100% width (default is off). This will usually cause horizontal images to not cover the window entirely. Components The following options are not taken into account when in Single image mode. Navigation arrows Displays arrows for navigation (default is on). Slideshow controls Turns the navigation on/off (default is on). When turned off, the whole Supersized footer is hidden and the navigation controls are hidden. You may still display the captions (if the Slides captions option is on) even when this option is turned off. This allows the use of html in captions without the Supersized footer being displayed. When turned off, the controls will not be visible but the keyboard navigation will still be available (unless you disable it in the corresponding option). For custom navigation buttons, replace the images in your /wp-content/plugins/wp-supersized/img/ folder. Thumbnail navigation Toggles forward/backward thumbnail navigation (default is off). When on, thumbnails from the next/previous posts are generated and can be clicked to navigate. If there is no thumbnail available for the slide, it will simply scale down the full size image, which can slow performance. For both Thumbnail navigation and Thumbnail links in thumbnail tray, thumbnail files must be present in a thumbs/ directory within the corresponding slides folder, each thumbnails having the same name (+ suffix) as its corresponding image, i.e. the slide image_1.jpg in wp-content/supersized-slides and its thumbnail image_1-1.jpg in wp/content/supersized-slides/thumbs. Thumbnails must be 150 px high to avoid resizing by Supersized. Thumbnail suffix The suffix to use for recognizing the thumbnails. Default is -1. Thumbnail tray Thumbnail tray appears at the bottom of the screen when clicked on bottom right arrow (default is on). If you select this option and do not select the next one, there will be no thumbnail in the tray which is not really useful. See the Thumbnail navigation option above for details about thumbnails. Thumbnail links in thumbnail tray Generates a list of thumb links in the thumbnail tray that jumps to the corresponding slide. If there is no thumbnail available for the slide, it will simply scale down the full size image, which can slow performance (default is on) Slide links None Numbers Slide title Empty (default) Shows a list of the slides in the navigation bar – Better to leave it on Empty or None for now, as there are still some issues with how Supersized is displaying this. Slide numbers Enables/Disables the slide counter (default is on). Slide caption Enables/Disables slide captions (default is on). According to the source of images, captions are extracted from: The IPTC caption field of the jpg image file for default or custom folders The caption field of the image for WP Gallery images. The description field of the image for NextGEN gallery images. The title field of the corresponding image in the xml file. Progress bar Enables/Disables the progress bar shown at the bottom of the screen (default is on). Fluid thumbnail bar Enables/Disables the fluid move of the thumbnail bar to the left or right based on mouse location (default is off). Flickr The following options are specific to the Flickr mode. Flickr Source Tells Supersized which of the options to pull the images from. Set: pulls images from a set. User: pulls images from a user. Group: pulls images from a group (default). Tags: pulls images by tags. Set You must provide the ID number of the desired set (located in the URL). User You must provide the ID number of the desired user (idgettr.com). Group You must provide the ID number of the desired group (idgettr.com) Tags You must provide the desired tag(s) How many pictures to pull Between 1-500 (default is 100). Flickr Size The image size to pull – t,s,m,z,b (smallest to largest, default is z). Details on flickr.com Sort Images By Sort images by date posted, date taken, or interestingness (Default is Date posted). Sort Direction Select the sort direction (Default is Descending). Flickr API key You need this in order for this to work. You need to get your own at flickr.com Picasa The following options are specific to the Picasa mode. Picasa Source Tells Supersized which of the options to pull the images from. Album : pulls images from a Picasa album (default). User: pulls images from a user. Tags: pulls images by tag. Album You must provide the ID of the desired album. It can be found in the URL of the link to this album. User You must provide the ID number of the desired user (either you Picasa user name or the long number in the URL to your profile). Tags You must provide the desired tag(s). You may combine several tags (comma- or “+”-separated = AND, “|”-separated = OR). How many pictures to pull Between 1-500 (default is 100). Picasa Image Size The image size to pull – 512, 640, 720, 800, 1024, 1280, 1440, 1600. The Picasa API will return the largest size available if your selection is larger than the original. Sort Images By Sort images by date published or date updated (none uses default Picasa order) (Default is Date published). Sort Direction Select the sort direction (Default is Descending). Picasa Author key You need this in order for private albums to work. It can be found in the URL of the link to a private album (each album has a different author key) Smugmug The following options are specific to the Smugmug mode. Smugmug Source Tells Supersized which of the options to pull the images from. Keyword: pulls images by keyword. User: pulls images from a user. Gallery: pulls images from a gallery. Category: pulls images by category. Keyword Comma-separated Smugmug keywords (they are combined). User You must provide the nickname of the desired user. You may combine it with keyword(s). Gallery You must provide the ID of the desired gallery Category You must provide the desired category. How many pictures to pull Between 1-100 (default is 100). This is currently the maximum allowed by the Google Feed API used by the plugin to get the images. Smugmug Size The image size to pull – Tiny, Thumb, Small, Medium, Large, XLarge, X2Large, X3Large, Original. Details on help.smugmug.com Sort Images By Sort images by date published or date updated (none uses default Smugmug order) (Default is Date posted). Sort Direction Select the sort direction (Default is Descending). Update Click here and your options will updated! Reset To reset all WP Supersized options. Required when you change theme. Thanks A big Thank You to Sam Dunn for developing the Supersized jquery extension. Thanks to the many developers who make so much information available for those (like me) who need to learn from more experienced people. Special thanks to Joke and Sandro who helped me finding the solution to a bug present in the plugin when WordPress is installed in its own folder. Thanks to the generous donators who encourage me to develop my plugin further (and start working on new ones!) by making a donation.