→ Get a quote ←

Shellbot’s Easy Image Display

Sometimes you need a proper image gallery to display particular images, and there
are plenty of plugins for that. Shellbot’s Easy Image Display is for those other
times, when all you need is an easy way to display some random images, or X latest
images uploaded to your site.

Download Plugin

 

Current features include:

  • Newest, oldest, random and custom sorting options
  • Include/exclude images based on ID
  • Widget, shortcode and template tag for maximum flexibility
  • Display images at various sizes
  • Control how many images are displayed and in how many columns
  • Link images to a lightbox, or remove link entirely
  • Uses gallery shortcode so will always fit your theme

Features soon to be added:

  • Filter by attachment status
  • Slideshow layout
  • Custom image sizes

Installation

1. Upload the ‘easy-image-display’ directory to the ‘/wp-content/plugins/’ directory
2. Activate the plugin through the ‘Plugins’ menu in WordPress
3. Add images using one of the three methods explained below
4. Enjoy!

Usage

Shellbot’s Easy Image Display provides 3 ways of displaying images; widget, shortcode and template tag. Each method accepts the same options and will result in the same display.

Widget

The Easy Image Display widget is the easiest way to display your images. The basic settings allow you to control image size, order and number. More advanced settings are collapsed by default to provide a simple uncluttered interface.

Choose your options, hit save, and rejoice.

Shortcode

To display images inside a post or page rather than a widget area, you need a shortcode.

Default settings:

[sb_easy_image]

Custom settings:

[sb_easy_image num="1" order="random" link="lightbox"]

Template tag

The template tag is available for users who are confident in adding code to theme files, and need to display images outside of the widget areas or main content area. The following function can be added anywhere in your theme files.

Default settings:

<?php sb_easy_image(); ?>

Custom settings:

<?php

$args = array(
    "num" => "1",
    "order" => "random",
    "link" => "lightbox",
);

sb_easy_image( $args );

?>

Options

If you’re using the widget, the options are all clearly marked. You can’t go far wrong.

If you’re using the shortcode or template tag, here’s what you need to know:

Parameter
Description
Options
Defaults ( widget, shortcode, template tag)
numNumber of images to display.Any number1, 9, 5
orderOrder displayed images by...Newest, Oldest, Random, CustomNewest (all)
sizeSize of image to be loaded. The display size will depend on your theme and number of columns chosen.Thumbnail, Medium, Large, FullThumbnail (all)
linkTarget link when images clicked.None, File, Attachment, Lightbox, URLFile (all)
urlStatic URL images should link to when "url" is chosen for link parameter.Any URLn/a
columnsNumber of gallery columns to display.Any number1, 3, 5
filterInclude or exclude images from results, or show only specified images.Include, Exclude, OnlyOnly (all)
idsImage IDs for use with the "filter" option.ID numbers, separated with a comma. ID ranges also accepted (e.g. 12-17)n/a
Has my plugin helped you out? Donations go toward the development of more awesome free plugins like this. Every penny is appreciated. Donate through Paypal.

Comments ( 67 )

                                                  • Marko Lubar says:

                                                    Hello!

                                                    I have a problem with this plugin: Nothing happens when I click on “Advanced settings” (I’m trying to use it as a widget).
                                                    Wordpress version is 3.7. Thank you in advance!

                                                  • admin says:

                                                    Hi Marko

                                                    You’re right, it doesn’t appear to be expanding properly when the widget is first dragged into a sidebar. I’ll push out a fix for this with the next update, but in the meantime you should be able to get it working by refreshing the widgets page. Not ideal, but it should work!

                                                  • Marko Lubar says:

                                                    It works now, thanks!

                                                  • daniel says:

                                                    Best random image plugin. Its flexible. Its perfect for our needs. Well done.

                                                  • admin says:

                                                    Thank you Daniel, much appreciated!

                                                  • Migo says:

                                                    Hi
                                                    Thanks for a nice plugin.
                                                    1) Any idea how to center the photo in the page/post. The short code is not responding to

                                                    [sb_easy_image num="1" size="full" order="random" link="none" ids="1,2"]

                                                    2) Any way of including the title of the photo in the short code?
                                                    Regards
                                                    Migo

                                                  • admin says:

                                                    1) Try adding column=”1″ to the shortcode, if it still doesn’t center then the problem lies with your theme’s handling of gallery styles.

                                                    2) Not currently, though the caption should display so you can always make sure the caption matches the image title as a workaround for now.

                                                    Thanks!

                                                    p.s. I also replied to your post on the support forum with more details

                                                  • Lauren says:

                                                    How can I change the widget so that it doesn’t use my templates list style css?

                                                  • Will Otto says:

                                                    awesome plugin, template tags work perfect! just one thing i noticed, the code under ‘Custom Settings:’ in the template tag should read…

                                                    $args = array(
                                                    “num” => “1″,
                                                    “order” => “random”,
                                                    “link” => “lightbox”,
                                                    );

                                                    sb_easy_image( $args );

                                                    ?>

                                                    anyways, thanks again! cant wait to use this on more sites!

                                                  • admin says:

                                                    Oops! You’re right, good catch. You’ll forgive me for editing your comment, I’m sure ;)

                                                    Thanks so much for the kind words, it’s my first plugin so reactions like this always help!

                                                  • Will Otto says:

                                                    thank you, i was so embarrassed with my inability to post a useful comment o_O

                                                    but yes, very good plugin, very easy to use, quickly becoming one of my favorites!

                                                  • Matt says:

                                                    Hello,
                                                    The plugin is working great but I’m getting a grey border around each of the images. Do you know why this is happening? How can I remove this border?
                                                    Thanks.

                                                  • Shellbot says:

                                                    Hi Matt, it sounds like that’s the gallery styling from your theme so you should be able to override it with a bit of CSS. If you need help drop me a message through the contact page with a link to your site and I’ll take a look when I can :)

                                                  • Peter says:

                                                    Hi,

                                                    Thanks for this nice plugin, but I have discovered one minor issue:

                                                    Using 4 images in 4 columns to create 4 thumbnails horizontally across with random selection. even so we have 36 images in the library, we do get duplicates displayed. Is there any chance to amend the code in the next version(s) to allow for each image to only be selected once?

                                                  • Shellbot says:

                                                    Hi Peter, thanks for reporting this. I’ll look into it.

                                                  • Dave Ferguson says:

                                                    I don’t get it!

                                                    There’s no information on how to actually upload the images. They are not taking them from my media library. The term ‘Image ID’ is not used in the image library so I can’t see how to use that.

                                                    Weird there’s no instructions for widgets like there is with shortcode or template tag, which are for people that actually know about coding.

                                                    Gonna have to try another plug-in as need this up asap :-(

                                                  • Shellbot says:

                                                    Hi Dave

                                                    The plugin should in fact be pulling in images uploaded through your media library, so I’m sorry it doesn’t seem to be working for you. This isn’t a problem that has been reported by other users, so it may be an incompatibility with a particular theme or plugin in use on your site.

                                                    If you’d like me to investigate please get in touch through the contact page and we’ll look into it together, hopefully I can fix the incompatibility and avoid others running into the same problem.

                                                  • Ben Styles says:

                                                    Forgive me for being stupid but I can’t work out what ‘Image ID’ refers to…? How do I reference a specific image in the ‘filter’ field? Thanks so much!

                                                  • Shellbot says:

                                                    If you click through to a particular image in your media library, the URL at the top of your browser will be something similar to this:

                                                    yoursite.com/wp-admin/post.php?post=THISISTHEIMAGEID&action=edit

                                                  • Don says:

                                                    This isn’t so when I click on the image. I see something like:
                                                    http://www.mydomain.com/home/sketch_bed_054/

                                                  • Russ says:

                                                    Very nice PlugIn! A welcome find.

                                                    I am curious about the link=”attachment” option. That seems to take me to a thumbnail of the image itself. Maybe I’m misinterpreting, but is not the image itself the ‘attachment’? I was hoping it would take me to the post that included the image as an attachment. Is there a mechanism to make that happen?

                                                    Thanks for any input/suggestions!

                                                  • Shellbot says:

                                                    Hi Russ. “Attachment” in WordPress terms is basically just the file itself, but displayed inside your theme (by comparison “file” will just lead to the actual file without any theme styling around it).

                                                    At the moment there is no option to link the images to a post, since many images may not be attached to posts at all. It’s something I’m looking into as part of the “Filter by attachment status” upcoming feature.

                                                  • Ken says:

                                                    Hi,
                                                    The site I am working on is in development right now. I am having a problem with the image not always changing. When I change from page to page, it sometimes changes, sometimes it does not. Any way to force it to change every time? I am using the widget in my right header to change the image there.

                                                    Thanks,
                                                    Ken

                                                  • Shellbot says:

                                                    Hi Ken. It sounds like you’re using the “random” display order to generate your images? Unfortunately this will just pick a random image on each page load which will sometimes result in the image not changing (especially if there aren’t many images to choose from).

                                                    I’m not sure if there’d be a reasonable way to “fix” that, as it is behaving as intended, but if a flash of inspiration strikes I’ll certainly let you know.

                                                  • Colleen says:

                                                    Thanks for the fix for PHP 5.4. Is there a way to write the short code so it only pulls jpg images? I have some png and pdf files in my media and don’t want those pulled.

                                                  • Colleen says:

                                                    The shortcode works perfectly when I insert it right into a page, but when I inserted it into a php include page it just shows the shortcode and no images. Anything else I put into the php include page shows up fine. Any ideas why this might be? I was using another Random Image plugin prior to switching to Easy Image Display and it worked fine in my include file.

                                                  • Shellbot says:

                                                    By “php include page” do you mean one of the .php files in your theme? In this case you should be using the template tag, rather than the shortcode. I just woke up so if I’m misunderstanding your question, apologies! :)

                                                  • Colleen says:

                                                    No, I create a text.php file with the shortcode in it and then use a php include where I want the code to show up. I have a plugin that lets me create php includes, but to insert a php include into a page it requires its own shortcode so maybe inserting a shortcode via another shortcode is just not working!!! LOL No worries, I just added it to all my pages directly, but just today, I decided I wanted to change from 3 to 4 columns so I had to go to every page that displays the photos to make the change and it would have been so much easier to just go to the one text file and make the change.

                                                  • Shellbot says:

                                                    Ouch. I’d definitely like to have a look at that, what’s the plugin you use to create these includes?

                                                  • Leris Hambleton says:

                                                    Thank you for the plugin. It is so easy to use. I cannot figure out how to filter the images I want to only be included. Can you tell me how? Thanks so much!

                                                  • Shellbot says:

                                                    Hi Leris, I just woke up so forgive me if this makes little sense.

                                                    You’ll need two settings to make this work. The filter option should be set to “only” and you’ll need to enter a the image IDs you’d like to display in the IDs option, separated by commas.

                                                    To find an image ID (I need to add this to the main instructions/FAQ, sorry):

                                                    If you click through to a particular image in your media library, the URL at the top of your browser will be something similar to this:

                                                    yoursite.com/wp-admin/post.php?post=THISISTHEIMAGEID&action=edit

                                                    So the IDs option should be set to something that looks like this: 12, 43, 325, 31 to show just those four images.

                                                  • jp says:

                                                    Probably dumb question, but does your plugin allow sequential display of random images (in the same location)on browser refresh? If not, do you know of any plugins that do?
                                                    Thanks a bunch.

                                                  • DaVe says:

                                                    Thanks for the plugin, it seems to be perfect for what we need. I cannot figure out how to get it to display the full image though. My shortcode is: [sb_easy_image num="1" order="random" link="none" size="full" column="1" ids="110"] and I keep getting a thumbnail size image. Changing to size=large or size=medium, also seem to have no effect. (size=thumbnail does give me a square thumbnail) Thanks for any advice.

                                                  • M Waters says:

                                                    Is it possible to have the images display a background images and full screen?

                                                  • M Waters says:

                                                    oops, sorry, “display AS background images and full screen”

                                                  • Shellbot says:

                                                    Sorry but right now there’s just the basic gallery layout. This may change in future, but it would be quite far down the request list.

                                                  • Diego says:

                                                    Hi,

                                                    First of all, thank you for this amazin plugin.

                                                    I’m having an issue. Look at the sidebar on http://livrosdeguerra.com.br/. Below the imagem there is a huge space until the next widget. Do you have any ideia why this is happening?

                                                    Cheers,

                                                    Diego

                                                  • Shellbot says:

                                                    Hi, sorry I just had chance to check this and I can’t see the problem on your site. Did you already figure it out? If not I’ll be happy to help debug over the weekend.

                                                  • blacky says:

                                                    Nice plugin, but..
                                                    I have a problem with it.
                                                    As soon as I enable the plugin, all my Jetpack Tiled Mosaic Galleries are broken. They go back to a normal Gallery. Is there a workaround?
                                                    regards Blacky

                                                  • Shellbot says:

                                                    Unfortunately Jetpack Tiled Galleries doesn’t play nicely with other plugins that affect the gallery shortcode. I have yet to find a proper solution for this but there is a possible workaround in this thread: http://wordpress.org/support/topic/jetpack-tiled-galleries-1

                                                  • blacky says:

                                                    Thank You, for the moment Your thread solves my problem.

                                                  • Magdazelena says:

                                                    thank you, it’s great, very simple and easy to use for the client/user and to maintain for developer!

                                                    I just wonder, if it is my mistake or what is the issue that when I add image to post and add custom url to it, it is “clickable” only on the right half of the picture? I have a completely self-made theme so the problem might be on my side.

                                                  • Shellbot says:

                                                    Hi, that sounds like a CSS issue but it may very well be a combination of both plugin and theme. Could you post a link here or through the contact form and I’ll take a look? Thanks.

                                                  • Barry Dollar says:

                                                    I have set-up SB Easy Image widget. It loads but does not randomly load images. It seems to be stuck on one image. Here is a screenshot of my set up: http://gabaptist.org/wp-content/uploads/2014/03/Screen-Shot-2014-03-13-at-12.53.06-PM.png
                                                    Thanks!

                                                  • Shellbot says:

                                                    Thank you for the report, I’ll see if I can recreate/fix the problem over the weekend.

                                                  • Alan says:

                                                    Hi
                                                    Thanks for this plugin. It is really what i needed. I have only one issue with it. I’m placing in in a footer and want to display as a grid of 9 pictures in 3 rows and 3 columns. The problem is that there is a huge gap between rows. The columns are fine. Is there any way I could edit the css to get images to look like a grid? I attached a link above

                                                  • Shellbot says:

                                                    Hi Alan

                                                    I see the problem. It’ll look a lot better with the following CSS (you can add that in style.css or possibly through some sort of options panel depending on your theme).

                                                    #gallery-1 .gallery-item {
                                                    margin: 0;
                                                    }

                                                    Hope that helps!

                                                  • Alan says:

                                                    that worked! thank you so much :)

                                                  • Olga says:

                                                    Hello! Thank you for a perfect plugin!
                                                    It works great!
                                                    I have two questions:
                                                    1. I use quite a lot of pictures to rotate and it’s hard for me to print their ID’s with hands. Are there any other ways to of it? 3557-3597 instead of 3557,3558,3559 etc
                                                    2. How can I make some spaces between pictures? For example, in this page: http://skrebeyko.com/mak-cards/power_and_weekness/
                                                    Thanks again!

                                                  • Shellbot says:

                                                    Hi Olga. Thank you for the kind words :)

                                                    There is currently no way to enter a range of IDs but this is a good idea. I’ll see if it’s possible to implement something like this for the next version. Added to the top of my todo list!

                                                    For your second question, adding something like this to your CSS should work:

                                                    .site-main .gallery .gallery-item { margin-bottom: 10px; }

                                                  • Dave K. says:

                                                    Hi! I am trying to use the shortcodes to display full-size, random images on my website, but they keep appearing as thumbnails, and if I include size=”full”, then the thumbnail is squared, cutting off two thirds of the rectangular images. The images are 980 x 300 px

                                                    I’m using the responsive theme, iFeature Pro 5, by Cyberchimps. My testing page in which I’m using your plug-in is at http://www.locatehome.com/test-page/

                                                    In an HTML box, directly under the menu area, I’m using this shortcode:
                                                    [sb_easy_image num="1" column="1" order="random" link="none" size="full" ids="69, 67, 65, 63, 61, 59, 57, 55"]

                                                    In that area, the entire image is displayed, but in a small thumbnail, only about one-third the size of the area, plus a lot of margin or padding around the image.

                                                    Inside the Page area in the theme, I have not specified the size, and although the size is larger, two-thirds of the image is cut off. I am using this shortcode:
                                                    [sb_easy_image num="1" column="1" order="random" link="none" ids="69, 67, 65, 63, 61, 59, 57, 55"]

                                                    Each shortcode has the same result in whichever area I place it. I’ve also tried deleting the references to column and link, but that didn’t make any difference.

                                                    By the way, if there is to be no more than one column and no links, should those just be left out anyway? And is there way to reduce the padding around the images or is that probably just a function of the theme I’m using?

                                                  • Shellbot says:

                                                    I took a look at the page you linked, it seems the gallery code is being output as if 3 columns were in use (which explains why it’s only roughly a third of the width of your page). Could you double check the column is definitely set to 1 in your shortcode? If so I’ll need to do some testing of that and see if I can reproduce.

                                                    The default settings for the shortcode are to output 3 columns and link to the image file so that’s what will happen if you leave those parameters out, check the table in the post above for any other defaults you need to know.

                                                  • Itamar says:

                                                    Thanks for a great plugin!

                                                    Two questions (not completely different from Olga’s above):

                                                    1. When specifying image IDs (e.g. ids=”502,510,507″ with columns=”3″), is there a way to make the sort order match the order in which the IDs were specified? (instead of random / oldest / newest)

                                                    2. Same scenario, what CSS magic would insert some padding around the images, so their not “touching” each other on the sides? (trying to set margin-left/right makes the last image wrap to the next line)

                                                  • Shellbot says:

                                                    Hey Itamar

                                                    1. That isn’t currently an option, but it’s such an obvious thing for people to need I can’t believe I didn’t add it in the first place! I’m pushing out a new version next weekend and will make sure this is included :)

                                                    2. Unfortunately it kind of depends on your theme since every theme styles the gallery differently. If you’d like to leave a link I’ll happily take a look.

                                                  • Itamar says:

                                                    Thanks!

                                                    Glad to hear you’ll add in my sort order suggestion :-)

                                                    In this test post you can see 2 layout issues: http://wpsandbox1.ostricher.com/2013/09/quick-evernote-template-based-note-creation-with-launchy

                                                    In the beginning of the post (about 3 paragraphs in) there are 3 images (displayed with columns=”3″, in “gallery-1″ div) that interfere with a “share-it” block (id “tr_shareit-4570″) from the ShareIt plugin, which makes the layout pretty messed up.
                                                    In that case I would have liked the “gallery-1″ div to move (up or down the page) so it doesn’t break like this.

                                                    Around the middle of the post you can find “gallery-2″ div, that shows the no-padding-between-images that I referred to in the previous comment.

                                                    My theme is BuzzBlog Theme.

                                                  • Shellbot says:

                                                    Looks like your theme is struggling when you choose an image size that would be bigger than the gallery item and needs to be limited width-wise. Try something like this:

                                                    .gallery img {
                                                    max-width: 90%;
                                                    padding: 5%;
                                                    }

                                                    Or ofc you can do it just for a particular gallery like this:

                                                    #gallery-1 img {
                                                    max-width: 90%;
                                                    padding: 5%;
                                                    }

                                                    You might find the CSS selector needs to be more specific if there’s something else affecting those images from your theme CSS.

                                                    As for the other problem, you should be able to clear the share box like this:


                                                    #gallery-1 {
                                                    clear: both;
                                                    }

                                                    Hope that helps!

                                                  • Itamar says:

                                                    Awesome! Exactly what I wanted :-)
                                                    Thanks!

                                                  • Itamar says:

                                                    re. the sort order suggestion, I’m sure your update will be correct and well-tested, but in the meantime I hacked around to get it working for me.

                                                    In case you’ll want to start from my hack, here’s the diff against your sb-easy-image-display.php as it is on your current trunk:

                                                    188a189,192
                                                    > case ‘preserve’:
                                                    > $query['orderby'] = ‘post__in’;
                                                    > $query['order'] = ‘ASC’;
                                                    > break;

                                                  • Miko D says:

                                                    On the http://forestroutes.org/community-transport/ site I’m using images to appear at random in the sidebar of many pages (using Widgets Controller 1.1) and using advanced options to link those images to a URL (http://forestroutes.org/volunteering/) … but the images link to their own image file instead. WP 3.9.1 on a TwentyTwelve theme. Thanks ShellBot. Mark

                                                  • Shellbot says:

                                                    Thanks for the report. First of all, if you could just double check that you have both the link option set to “URL” and a valid URL entered in the “Static URL” field in the widget settings.

                                                    It’s possible the Widgets Controller plugin is interfering in some way, so I’ll test that as soon as I can and see if the problem can be recreated.

                                                  • Miko D says:

                                                    Thanks Shellbot. I’ve checked both that the drop-down is on “URL” and that the static URL is a valid and tested cut-and-pasted target.

                                                    Cheers

                                                    Mark

                                                  • Nick says:

                                                    Hey Shellbot! First, thanks for your hard work! My question is, I’m trying to do a before and after images for people to checkout. So can I use the shortcode on a page to display 15-20 images then another “After” shortcode for a different set of 15-20 images? Or will the shortcode display all available images?

                                                    Essentially just need to display to different sets of images.

                                                    Thanks for your help and thoughts!

                                                  • Shellbot says:

                                                    Hi Nick

                                                    You can show specific images by setting the “filter” option to “only” and entering either a comma-separated list of image IDs, or a range of image IDs (for example, 13-27).

                                                    You’d need to use the shortcode twice, with different image IDs specified.

                                                    Hope that makes sense, it’s early in the morning here :D

                                                  • Robert G says:

                                                    Thanks for this plugin. I’m having the same problem as Miko D. Doesn’t matter what I select for the link or how I add the link (full url or relative url) the attachment page opens. Still on local installation, hence cannot provide a link.

                                                  • Shellbot says:

                                                    Thanks for the report. I’m still looking into this issue, will send you an email.

                                                  Leave A Comment

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