Clicky

Tom Thumb
My Image

All the latest RapidWeaver Stacks reviewed,
plus the most important community news …

Stay up to date with current RapidWeaver developments

Tom Thumb

An iFrame is used to display an external page, or part of an external page within the current page. But what if we change the concept of an iFrame and turn it into a widget; an iFrame that displays a thumbnail of a webpage. Now you can turn your iFrame into a live portfolio, a weather widget, or, or… are there are any limitations?
Suddenly an iFrame has a lot more scope.

Live Thumb

RWExtras' Live Thumb is just such a stack, it displays a thumbnail of your website and its size is limited to the width of the stacks container you drop it into. Its height can be determined in the settings panel. Oh, and if you click on the thumbnail, you are automagically transferred to the page in question.

So let's take a look: First you'll need a URL for the page to be displayed. Next you will want to set the Height of the page in proportion to its width. The higher you set the percentage, the more of the page you will see displayed. The default setting is 100% which results in a square thumbnail – ideal for most responsive sites (and it is the mobile view that will be displayed in narrower columns).

There is just one more setting; Scale Amount sets the amount that the thumbnail will be scaled by. You have four choices: 100%, 75%, 50% (default) and 25%.


I can see a wide range of possibilities for Live Thumb!

Talking of thumbnails, we usually associate them with miniature sized images that we can click to view the full-sized image. The next stack is just such a stack.

Master Gallery

RWE's Master Gallery is a stack that places a row of thumbnails on your web page and allows you to view each of them in a size that is dictated by their containing stack. I won't use the term 'Lightbox', because we have come to accept that a lightbox opens a separate window to view the images. That's not how Master Gallery works. It is, however, an appealing alternative to other carousel stacks.

The Nitty Gritty: If you drop a Master Gallery stack onto your page, you'l find the typical Stacks 3 + button which allows you to add an image. You may choose between a Single Local Image, or a Single Warehoused Image. If you choose Local, you can drop an image into the stack settings' image well. If you choose Warehoused, you can set an URL to the image. You will need both a preview and the full sized version of your image. Below the image well, you can enter an Image Title (for SEO purposes) and an Image Caption.

Add as many images as you wish your slideshow to contain and then click the Master Gallery container stack to set up how it displays your images.

You have a number of options, the first being Configuration. Here you have a choice of Carousel, or Full View. The default setting, Carousel, displays a row of thumbnails with the first image displayed in full resolution below it. However, two buttons are displayed above the published stack, which will show or hide the carousel. Full View hides the carousel when the page is first loaded. The Carousel can then be viewed by clicking its button.

To navigate through the images, you can either click on an image in the carousel, or advance the main image, one image at a time, by clicking the arrows provided.
You now have the option to display the View Buttons top right or top left of Master Gallery. The Button Colour may be set to Light, or Dark.
Master Gallery's Border Radius is set to 10px by default and suits the stack well. The default Thumb Size is 65px. Depending on the number of images your gallery contains, or the width of the container stack, you may wish to alter this setting.

Now follow the Full View Padding and the colours for the Thumb Border in its Normal and Active states and the overall Colour Scheme. The default Colour Scheme is set to dark grey. Neutral, but not to everybody's liking. You'll want to match the scheme to your site's colours.

The Image Captions are displayed below the main image and can be set to italics.

Master Gallery is a simple carousel stack to set up, with no bells, or whistles such as auto advance, but hey! I've had the auto advance function criticised on two sites because images advanced too quickly, or not quickly enough.
I rather like Master Gallery for its simplicity and I'm sure many users will agree with me.

blog comments powered by Disqus

Links to the developers ® All trademarks cited on this page are the property of their respective owners.

Subscribe to Ninja News
or ask a question

Hi, I’m the Ninja Bot. What’s your name?
image/svg+xml
Nice to meet you, [1-1]. Could you tell me your mail address?
image/svg+xml
[1-1], would you like to subscribe to the monthly Ninja Newsletter?

Yes, I would like to receive your monthly newsletter.

No thanks, I’m good for now. I have a different issue.

image/svg+xml
Thanks for your support, [1-1]. Is there anything else I can do for you?
image/svg+xml

[1-1], thanks for subscribing. If you made a further request, I’ll get back to you – typically within 24 hrs.

image/svg+xml
Name: [1-1] [1-2]
Email; [2]

Contacted you via the Siphon form at Ninja News.

I would like to subscribe to the Ninja Newsletter

Message

[4]
I’m sorry tohear that, [1-1]. How may I help you then today?
image/svg+xml

[1-1], thanks for contacting me. I’ll review your mail, and get back to you – typically within 24 hrs.

image/svg+xml
Name: [1-1] [1-2]
Email; [2]

Contacted you via the Siphon form at Ninja News.

I don’t want to subscribe to the Ninja Newsletter right now.

Message

[6]

Thanks again for contacting us. Your request was successfully submitted.

Contact Information

rjh logo

rjh web design

265 Moo 2
Mae Na Toeng Nai, Pai
Mae Hong Son
Thailand 58130

About Us

We design websites and print-products for small businesses at reasonable prices. We specialise in Responsive Web Design.

Legal

This site uses Cookies to determine the best method of display in combination with your browser.
We do not harvest or sell personal information.
© rjh web design 2010—17

Powered by rjh-design

This website was built with loving care on a Mac using Foundation. For more information, contact me.

Don’t miss a post!

Sign up for our monthly newsletter.

A monthly digest of all the latest updates from our RapidWeaver blog, keeping you up to date with the hottest new stacks and themes.

View previous campaigns.

Subscribe to the Ninja Newsletter

* indicates required