Image Gallery Reloaded

Jul 30, 09 • Tools • 212 Comments

 

You’ve seen all those galleries for the incredible WordPress engine. Most of the time they are managed separately, via big files, the images are loaded externally etc. But WordPress already has it’s own gallery feature and why wouldn’t we use it? It’s simple, accessible and easy to use. So let’s utilize it.

What is it all about?

Image Gallery Reloaded is a  jQuery based WordPress plugin which replaces the default WordPress gallery with a highly customizable mouseover slide show and gallery for every post. Check it out in action as you read the article. Nice places, huh?

What it does?

The Image Gallery Reloaded (IGR) plugin rips the images from the post’s gallery and displays them in a different way. This is a better approach for displaying images for a few reasons:

1. Custom styling ability

2. Ability to display simple straight forward images and a gallery in one post, just like we have here.

3. If, for some crazy reason, you will decide to uninstall IGR, you site will roll back to the basic gallery, no harm done. You will not end up with some strange image styling or loose your images.

What options are available?

What do I do?

How do I add  galleries to posts?

(Remember this is the default WordPress Gallery)

Installation

  1. Upload image-gallery-reloaded directory to the /wp-content/plugins/ directory.
  2. Activate the plugin via the Plugins menu.
  3. Configure your new gallery via the Settings > Image Gallery Reloaded Options.

Frequently Asked Questions

How do I add galleries to posts?

Remember, Image Gallery Reloaded uses the default WordPress gallery.

  • Write a new Post or edit an existent.
  • Add images to the post via the default Upload/Insert >Add an Image.
  • On the Add an Image popup click the Gallery tab, Click Insert Gallery and save the post.

How to display thumbnail on top?

  • Select the “Classic | thumbnail on top” theme
  • If you’d like to show the thumbnails outside of the main image, set Main Image Top Margin height to allow the required space.

How to add links to image descriptions and captions

WordPress escapes the double quotes in image descriptions and captions. Use Single quotes:<a href='http://my-awsome-site.com'>My Awsome Site</a>

Help, gallery does not display images

The gallery displays only selected images. This feature allows you to keep some of the attached images excluded from the gallery. This also means that if no images are selected, the gallery will not show up. To fix this issue with existing galleries:

  1. Go to your post and click the “Edit Gallery” button.
  2. At the top of the popup click “Include in Gallery: All” or select individual images
  3. Click “Save all Changes”
  4. Click “Update Gallery Setting”
  5. Click “Update” in the post’s Publish meta box

Changelog

2.1.5

  • [NEW] WP 3.5+ support

Important: Since WP has integrated the new Media library interface, which allows to select the displayeed images, the selective Gallery feature has been dropped.

2.1.4

  • [NEW] Mouseover effect on thumbnail to load the main image
  • [NEW] Show or hide thumbnail strip
  • [NEW] Use custom CSS
  • [NEW] Disable selective gallery. Show all images in all galleries
  • [REMOVED] Custom Themes Support. Now uses only the built-in themes, sorry guys

2.1.3

  • [NEW] On Post warning when no images were added to the gallery

2.1.2

UPGRADE NOTICE: Upgrading from versions prior to 2.1.2, please visit your gallery pages and select the images you want to display in a gallery:

  1. Go to your post and click the “Edit Gallery” button.
  2. At the top of the popup click “Include in Gallery: All” or select individual images
  3. Click “Save all Changes”
  4. Click “Update Gallery Setting”
  5. Click “Update” in the post’s Publish meta box
  • [NEW] Added functionality: Select specific images for the gallery / Selective gallery
  • [NEW] Added functionality: Theme support
  • [NEW] Added functionality: “Classic” theme with thumbnails on top
  • [NEW] Added functionality: Custom theme directory for user themes
  • [NEW] Added functionality: Image descriptions
  • [NEW] Added option: Toggle image Title and Description
  • [NEW] Added option: Theme selection
  • [NEW] Added option: Define main image top and bottom margins to allow thumbnails on top
  • [Bug fix] Title is cut after the first word

2.0.1

  • [Bug fix] Remove debugging mode for main JS library
  • [Bug fix] Use of undefined constant gallery – assumed ‘gallery’

2.0

  • Complete rewrite

0.6

  • [Bug fix] caption and tooltips displayed properly now
  • [Bug fix] Better Thickbox support
  • Multiple bugfixes and cleanup

0.5.6

  • [Bug fix] CSS for large galleries to form one line of images
  • [Bug fix] multiple galleries on one (archive) page.

0.5.5

  • [Bug fix] Resolved issues with the built-in jQuery
  • [Bug fix] Tooltip styling reserved to IGR only
  • [Bug fix] tooltip script reserved to IGR only
  • Other bugfixes

0.5.2

  • [NEW] Styled Tooltips added;
  • [NEW] Thickbox support added;
  • [NEW] Better function handling;
  • [NEW] Styling for tooltips from the Control Panel;
  • [NEW] “Loading Gallery” massage while loading the images;
  • [NEW] Transition Effects on image load;
  • [Bug fix] function conflicts on some themes;
  • [Bug fix] jQuery loaded twice in enqueue mode;
  • Other multiple bug fixes;

0.2.4

  • [Bug fix] Fixed “Headers already sent” error

0.2.3

  • [Bug fix] Changed improperly named files

0.2.2

  • initial release

Interested in contributing? Fork it on GitHub

screenshot-2



	       

212 comment(s)

Subcribe to this discussion. Feel free to post the comment, or trackback from your web site.

  1. Josh says:

    Hi Daniel,

    Is this plugin working with latest wordpress version (3.5) ?

    The plugin keeps telling me that no images are in my gallery – but they are showing there when i deactivate the plugin…
    Any ideas?

    • Daniel Sachs says:

      It’s not 3/5 compatible yet.
      In the meanwhile you can tick “Disable selective gallery” on the gallery settings page to display all your images or manually add your images IDs to the shortcode: [gallery include="166, 167, 165, 164, 163, 162, 161, 160"] if you wish to continue using only some of the images.

  2. Stan says:

    Hi there –
    Your plugin is awesome and has been working great.

    But the new version of WordPress 3.5 has mucked up the selection of images in the gallery.

    Are you working on the updated gallery plugin to be compatible with 3.5?

    Cheers

  3. Christian says:

    Hey Guys,
    is there a way to add/embed the gallery directly in templates files WITHOUT shortcode?

    Greetings, Christian

  4. Leo says:

    Hi Daniel,

    I have done some research regarding the displaying of picture info, , counter and next/prev arrows even if these options are unchecked. It is obviously only a problem in Internet Explorer and when you refersh you get the expected display without these options, so until this in some way will be fixed, do you know how to force a refresh each time the page with the gallery is opened ?

    rgds
    Leo

  5. Leo says:

    Hi Daniel,

    I am very fund of the plugin (Image Gallery Reloaded) – lots of good features, however, I have a slight problem. Even if I have unchecked information, next/prev arrows and image counter – it shows anyway in internet explorer. Not in Google Chrome and not in Firefox. Any ideas ? – I have removed all other plugins, which could interfere.

    Also I have an idea for your future development – what if you could choose another thumbnail for the picture, for example the description of the picture – then you could have a list of names as thumbnails and the correct picture corresponding to the thumbnail. Today I solve it by correcting the thumbnail in media, however, graphically it does not look extremely nice, try for example to got to testwpthemes.mindfolding.com and click “Medarbejdere”, then you can see what I mean.

    best regards
    Leo

  6. Jennifer says:

    Never mind my previous question. I just found your solution in the WordPress Support forum. I added

    #galleria {
    height:Some_Value_in_px;
    }
    to my css file (replacing “Some_Value_in_px” with the height I wanted).

    This removed the error message and now the gallery works perfectly. Thanks!

  7. Jennifer says:

    I used the .60 version for years. I recently upgraded to 2.1.4.

    But now I get the message:

    “Fatal error: Could not extract a stage height from the CSS. Traced height: 0px.”

    Do you know why this is happening, what I can do to fix this?

Do you have something to say?