Hire a web Developer and Designer to upgrade and boost your online presence with cutting edge Technologies

Tuesday, October 30, 2012

SuperCharging Your Image Galleries


WordPress SuperCharge Your NextGEN GalleryAt one time or another, we need to put a photo gallery on our WordPress website. There are numerous plugins that can accomplish this and I’ve tried a lot of them. However, very recently, I revisited one that I’ve tried before but never used because when I tried it years ago, we didn’t get along very well. I reacquainted myself with the NextGEN Gallery Plugin because of a new plugin that coordinates very well with it and now I’m a huge NextGEN Gallery proponent.
If you are unfamiliar with NextGEN Gallery, it is a plugin that allows you to place a gallery of images on a page or post fairly simply. You simply create a “gallery”, upload your selected images to it, and then use a shortcode in your page or post to display all the images nicely laid out and evenly spaced.
Whether you use NextGEN Gallery or another gallery plugin, or just simply manually place a group of images on your page or post, you probably want to provide your reader with the ability to view the photos larger on the screen. One method is to use a lightbox plugin to make the images fill the screen and the page/post dim in the background.

Not Another Lightbox Plugin!

Nope, this is not “just another lightbox plugin” – it’s unlike any of the others that I’ve seen. Even the team at NextGEN think so as they’ve written a post on their blog regarding it.

O.K. Enough Mystery. What Is It?

If you didn’t visit the NextGEN link above, then you’re still wondering what this is that I’m prattling on about. Well, it’s FooBox.
Funny name isn’t it? Well, the name may be funny, but this is a serious contender in the WordPress Lightbox plugin arena. To the best of my knowledge, FooBox is the only lightbox plugin that will resize the lightbox depending upon the device you are viewing the lightbox on. As you will see in the image below, whether it’s an iPhone, an iPad, a computer screen, an Android tablet, or whatever, the lightbox is resized to fit perfectly in the viewing area. With other lightbox plugins, the images are usually off center and chopped off.
Foobox Lightbox WordPress Plugin
On the FooBox website, you can view a demo of the responsive nature of the lightbox.

O.K But Why Would I Want Another Lightbox Plugin

Honestly, you probably don’t. But, once you use this, and realize the full potential of it, you will probably come to the same conclusion that I have. This will NOT be “another lightbox plugin” in my toolbox – it will be the ONLY lightbox plugin in my toolbox. Why? Two very important features make it my lightbox of choice now.

Responsive Image Resizing

FooBox WordPress Responsive Image ResizingTo date, I’ve not seen a single lightbox that can resize images depending upon the device you are using to view them. It allows all or selected images to respond to the device and orientation that your visitor uses to view your website. This was a huge benefit for one of my clients and I know it will be in more demand going forward.

Responsive Social Sharing Built In

WordPress FooBox Responsive Social Sharing Icons Built InIn today’s highly social internet environment, most websites depend upon sharing of images and video to bring additional traffic to their websites. In the spirit of, “you can never make it too easy for a customer to do business with you” FooBox makes it extremely easy for people to share your images with their friends and followers on the most popular platforms. The images appear on each photo and the visitor simply clicks the image to share it on that social network. What could be easier?

What Features Does FooBox Have?

FooBox boasts the following features:

WordPress Gallery Support

FooBox WordPress Gallery SupportBy simply clicking a checkbox, you can add FooBox to all galleries on your website.

Image Caption Support

FooBox WordPress Image Caption Lightbox SupportCheck a box and FooBox will pull the image caption information you’ve entered and display it very nicely in your slideshow.

NextGEN Gallery Integration

This allows you to use FooBox with both single images as well as galleries.
WordPress Custom CSS Class Support

Custom CSS Class Support

Got lots of heavy customization in your theme? No problem. With FooBox, you have lots of custom CSS class support to style this to match your theme.

OpenGraph Meta Data Integration

O.K. What exactly does that mean? You know those images that display on Facebook, LinkedIn, and other OpenGraph websites? Well, it means that those websites will now pull the proper images when things are shared on those websites.

Popular SEO Plugin Integration

FooBox WordPress SEO IntegrationBecause so many people use WordPress SEO by Yoast and All In One SEO Pack, support for these two plugins is built right in.

Auto Slideshow With Progress Bar

Got a lot of images in your gallery? Just enable the slideshow function and your visitors can sit back and relax while the images advance automatically.

Keyboard Navigation Support

Personally, I hate having to move my hand to my mouse unless I absolutely have to. So, anytime I can navigate with my keyboard I have a much better user experience. FooBox supports the ability to navigate through a slideshow using your keyboard.

All Images Option

This is the Ronco method…just “set it and forget it” and all images on your website will use FooBox when clicked.

Arrow Navigation Icon Selection

WordPress FooBox Plugin Arrow Icon Options
Choose from several navigation arrows in you FooBox. Plus, the arrows are responsive as well, so they resize according to the viewing device.

Color Scheme Selection

WordPress FooBox Plugin Lightbox Color Scheme Options
You can choose a color scheme for the border around your FooBox that works with your theme.

Fit To Screen Option

Sometimes, your images just aren’t big enough to match other images on your website or in your galleries. By choosing this option, you can force all your images to fill your screen for a more consistent sizing of images.

Show Or Hide Scrollbars

Clean up your viewing area by choosing to hide the scrollbars of long pages/posts when the FooBox is activated.

Show Or Hide Navigation Buttons

Don’t want to clutter up your FooBox with navigation buttons? Sure, just choose to hide them and your viewer will simply click the image or use the keyboard to navigate.

Custom Error Message Or Image

WordPress Custom Missing Image ErrorIf for some reason an image goes missing, you can choose a custom message or image to show in it’s place. Much better than that silly empty placeholder that we so often see.

Show Or Hide FooBox Affiliate Link

Want to make some money with FooBox? Just check the box to show the affiliate link and anyone that buys through that link will generate an affiliate commission for you. Don’t care about that? Just uncheck it.
WordPress FooBox Image Counter

Show Or Hide Image Counter

If you don’t want your visitor to know how many images are in your slideshow, simply choose to hide the image counter. If you want them to know, then you can choose to show the image counter.

Custom Counter Message

No more boring counter messages. If your slideshow is a series of funny political cartoons, you could make the image counter show something like “Political funny 7 of 14″ as an example. You can make the message anything that you feel is appropriate for your website.
WordPress Social Networks

Enable Or Disable All Social Icons

The social icons feature is one of the things that really first attracted me to FooBox, and it’s extremely useful. But, there may be occasions where you don’t want them to show up. If so, simply choose to turn them off and they’re gone.

Social Icons Positioning Options

You’re not locked into a single position for these social icons. You can choose from Top or Bottom as well as Left, Right, or Center.

Select Specific Social Networks

Don’t care about people posting your images on Pinterest? Fine, simply deselect Pinterest and that is no longer an option in the Social Sharing icons. You get to choose which social networks you want to make it easy to share your images on.

Advanced Settings Tab

When you become an experienced FooBox user (I’m not there yet), you can fully control and manipulate the Lightbox functionality with your own custom scripts. I don’t know of any custom scripts.

Do I Have To Use This With A Gallery Plugin?

Not at all. FooBox works independently as a lightbox plugin OR in conjunction with a gallery plugin. Put a gallery of photos – or a single photo – on your website and FooBox will take care of the rest. But, if you use NextGEN Gallery or some other gallery, then this just takes that plugin to a whole new level.

O.K. I Want It. How Do I Get It?

While this is a premium plugin, I think you will find the $17 starting price for a single WordPress website to be very affordable. If you’d like unlimited WordPress websites, then the $47 pricetag is even more affordable. I recently used this on a cabinet shop’s website and built over 40 different galleries using NextGEN Gallery and FooBox. From the start of the client’s website, they kept telling me that they were different from other cabinet shops so their website should be different. FooBox helped me achieve the “different” that they were looking for.
If you are using FooBox, I’d love to hear how you are using it. If you’ve not seen it yet, be sure to check it out and then leave your comments here with what you think of it.

Download Links

NextGEN Gallery
FooBox

Photo Credit

FooBox images courtesy of FooBox
Eadey via photopin cc
geirarne via photopin cc
greyweed via photopin cc
See-ming Lee 李思明 SML via photopin cc

No comments:

Post a Comment