Super Zoom Gallery

Yet another gallery plugin. I was looking for a simple gallery where you can
select a thumbnail, see the complete picture in a acceptable size but also have
the oppertunity to see the details of the image. I searched the web for a way
to do this and found the AnythingZoomer, a jQuery Plugin by Chris Coyier. I
used this jquery plugin for this WordPress plugin.

It works well for e-commerce sites like webshops or as a photo gallery.

It is easy to adapt if you would want to, but the default behaviour should be
very much usable by anybody.

There is a settingspage to customize the images used and wheter or not to over-
write the default gallery shortcode.

If you want to use this gallery, simply use the “superzoomgallery” shortcode in
your post or page, or enable the overwriting of the gallery shortcode and use
the default wordpress “gallery” shortcode in your post or page.

For best results, make sure your theme is wide enough for the gallery.

The site I created this plugin for is http://www.liekebieke.nl, a dutch webshop with handmade designer bags and other things. It is used to enable the visitors to view the details of the products.

This plugin is hosted in the official WordPress repository, so you can download it!

Here is a little demo with some pictures from Iceland, Wroclaw in Poland and a couple of fighter jets (what more could you want).

Jets
Artwork
Wroclaw
Iceland
Jets
Artwork
Wroclaw
Iceland

Trying to get through the cold dutch winter/summer

If you like to know more about PHP, JQuery or WordPress, or you just like reading you might consider buying a book from the bookdepository.

 

34 thoughts on “Super Zoom Gallery

  1. Hi, I am trying to use this plugin. I am new with wordpress. I add the code [gallery] or [superzoomgallery] but not working!! :( Another thing where do i upload the photos for the gallery? Please reply. Thanks!

    • Hello Sisir,
      Thanks for using super zoom gallery. If you are new to WordPress things can sometimes look a bit complex. If you want to add a gallery somewhere in a post or on a page, you first have to add your photos to the post. You can do this by uploading your photos when you are adding or edititing a post or a page. There are some icons on top of the editor in WordPress to upload files.

      After that, you can add the text [superzoomgallery] or, if enabled, [gallery] in your post/page. This is called a shortcode. This code is automatically replaced with the super zoom gallery and you should then see the gallery with your uploaded photo’s!

      Hopefully this helps to get things working for you!

      Kind regards,

      Niels Doorn

  2. Hai

    I use plugin it working very fine thanks

    i need one thing if possible, when we click on a image thumb then its discription appear at the below zoom box.

    if it is possible

    Thanks in advance

  3. I have a couple questions for you:

    Is is possible to have a french version of your image(powered by: )

    I am looking to add images from a gallery to a shopping cart, any suggestions?

  4. no suggestion for hiding the empty zoom-box?
    im not good with js and stuff

    maybe with n if thing to check if its in use or not and then i can put another class for the un-used box to hide it by css?

    cheers!
    Can

  5. hi niels : I would like to change the thumbnails to a size of perhaps 60x45mm, but I’m not able to do – wether at wordpress-media-settings nor at .css file – sorry, but what is to do?
    thank you for the fine plugin

    christof

    • Dear Christof,

      The way to do this in WordPress is via the theme you are using. There is a wordpress function for this called: add_image_size. The function reference can be found here:

      http://codex.wordpress.org/Function_Reference/add_image_size

      Ususally this is done in the functions.php of the theme. For example like this:

      < ?php
      if ( function_exists( 'add_image_size' ) ) {
      add_image_size( 'my-own-very-nice-thumb', 60, 45, true );
      }

      // the rest of the functions.php
      ?>

      After you added this to your theme, all new uploaded images will copied to a thumbname and will be automatically resized to 60×45 pixels. In the settings of the Super Zoom Gallery you can then select ‘my-own-very-nice-thumb’ as the imagesize to use for the thumbnails.

      Hopefully this will help you with your WordPress site!

      Kind Regards,

      Niels Doorn

    • Hello Farhad,

      Yes, you can change the thumbnail size in the ‘media settings’ of WordPress. Go to ‘Settings’ and then ‘Media’ and there you will find the size of the thumbnails.

      An other option would be to register a new image format in your template, see the reply I wrote to Christof on this for instructions on how to do that!

      Kind regards,

      Niels

  6. Hi,
    Firstly – great plugin by the way – it’s exactly what I’m after.

    Now, I’m trying to use the plugin with the Custom Field Template (http://wordpress.org/extend/plugins/custom-field-template/) – which is quite a powerful plugin, and one that I really need to be using for adding images etc.

    Is there a way I can use your plugin without using the shortcode? Can I call it in with php in the single.php or post.php?

    Thanks :)
    Dave

    • Dave,

      Thank you for the compliment!

      If you use the following PHP code in your templates, it should work:

      < ?php echo do_shortcode( '[superzoomgallery]') ?>

      Here is more information on this function.

      Hopefully this works!

      Kind regards,

      Niels

      • I would love this feature, too… either an option for the caption, or some sort of display of the Title and/or description for the images.

        In fact, I could be willing to pay you something if you’d be willing to go ahead and code that feature. E-mail me if you’re able.

  7. Hi , is there a way to change order of images in the gallery. Somethig like this:

    And how can I put zoom-box inside image (medium). Example: I want zoom box to be 100x100px inside the main image

    • I’ve thought about a zoombox, but not yet implemented it. As in your other message, It would be nice to have options like that and make it configurable. It’s on my backlog.

    • At this moment, this is not possible. But it is a good idea, so I’ll try to build it into a next release! Thanks very much!

  8. Hi,
    I love your plugin!
    Can you tell me if is possible to click on the small image on the left and have a lightbox effect? Just on click.
    Sorry for my bad english.
    Thanks
    Paolo

  9. Hi!
    Great plugin! Really.
    I’m tryng to figure out how to attach 4 or 5 images to the Gallery via Custom Fields.
    Can you help me?
    Thanks
    Paolo

  10. Hello,

    I’m so glad I found this plugin because it does exactly what I need it to do for a webstore and in a very elegant way :)

    I’m having one issue though….I’m wondering if you might know why I don’t get my first image loading full size when you first click on the page. I only get the line of thumbnails and only when you click the first thumbnail does the image load. I want the first image to load by default but can’t figure out where to change that setting.

    Thanks for you help!

    • Sorry for my late reply, do you have more then one gallery on this page? I know it does this when you have multiple galleries on a page…

  11. This plug-in is exactly what I need! Thank-you for sharing this with the
    WordPress community. I do have a rookie question….

    I am new to WordPress. I have placed an image on my page and then above
    the image placed the shortcode ( [superzoomgallery] ). This all works well
    during my testing of the page…I have performed numerous tests on the page….the problem is that now I am getting multiple images
    showing up in my “gallery” and don’t want them in there.

    In the first Post listed above, someone asked….
    Another thing where do i upload the photos for the gallery? Please reply. Thanks!

    Where do I modify the images that are showing up in the SuperZoomGallery?

    Thanks again for sharing your talents!
    Ted

    • Sorry for so many questions….I meant to include one other question…

      How do I reposition the “zoom” window? For clarification, I am talking
      about the “extra” window that shows the zoom effect for that particular image being examined.

      Thanks,
      Ted

      • Hello Ted,

        This could be done by chaning the CSS. By changing the CSS for the class “zoom-box” you can reposition it. I don’t know if you use your own theme, if you do I suggest you use the CSS of that theme to make the necessary changes rather then the CSS of the plugin. This to avoid any problems when updating the plugin. If you don’t use your own theme I would advice to change the CSS of the plugin and keep a backup of the changes to avoid losing them when updating.

        Hopefully this helps, if you have any other questions or need more specific help, don’t hesitate to ask me!

        Kind regards,

        Niels

    • Hello Ted!

      I am glad you like the SZG,

      All images that are added to a post are shown in the gallery. If you don’t want some images to be in the gallery, you have to delete them from the post.

      Hopefully this helps!

      Kind regards,

      Niels

Leave a Reply

Your email address will not be published. Required fields are marked *

*

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>