Clicky

RapidWeaver Stacks, PlugIns, Themes ...
My Image

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

Stay up to date with current RapidWeaver developments

Asgard – a new Bootstrap theme

Asgärd is one of the Nordic Nine Worlds and home to the well known location Valhalla, in which Odin rules. Asgard is a land more fertile than any other, blessed with a great abundance of gold and jewels. Correspondingly, the Æsir excelled beyond all other people in strength, beauty and talent.

Asgard is not a new theme, it is a massive update of an older theme from 1LD. Asgard has a number of new features, but the most important change is that the theme has been ported to Bootstrap, ensuring stability and fast loading times.

When you come to install  Asgard, you'll find not only the theme itself, but a folder full of Snippets, Theme Styles, Stacks and Photos plus a demo project. You'll do well to install the Theme Styles at least, because the 'New Asgard' style automatically has the new options activated.

Asgard is not a theme that you will simply set for your new project and then let rip.
One of the main new features is a touch-friendly banner slideshow with parallax effect. If you wish to use it, you'll need to find out how it works first. 

The slideshow is simple to set up, once you know how – insert as many images into your new page as you need for your slideshow and then edit the image names to include the word 'slide'.

For the parallax captions, you need to add text stacks containing 
<div class=caption>[your caption goes here]</div>
to your page – as many divs as you have images. If you want one of the images from the slideshow not to display a caption, you need to add the empty caption div. 

asgard caption

Make sure the div is set to ignore formatting, but the caption text is set to honour the formatting — that way, you can format your text as you need it. An image can be pasted inside the div instead of a caption text, if you prefer.

The theme setup has a list of options as long as my arm. At first glance, it is quite overwhelming. You can set the colour for just about everything – including background gradients for the eight Extra Content Areas.

asgard

Asgard has a lightbox for the Gallery that immediately reminds me of 1LD's Ice Box stack. The page fades to white when an image is opened and simple chevrons allow navigation from one image to the next. The image captions appear upon hover, in a coloured box set into the side of the thumbnail.

I found the body font size in Asgard rather too small – my eyes aren't what they used to be – but that was quickly rectified using RapidWeaver 6's new global CSS function. Font size will be a source of argument between web designers for years to come yet.

Asgard is fully responsive and looks great at all screen sizes. It comes with Font Awesome 'pre-installed' and presents a striking design which is appealing through its clarity. 

Due to the Bootstrap base, Asgard sites load quickly and smoothly, with 1LD's trademark fade-in effect (which can be deactivated). An introductory orientation is necessary before an initial project can be built, but the result will be an engaging website.

Comments

Duo – A stylish new MultiTheme

Duo from MultiThemes, Review By Rob Hall, CEO at rjh Web Design Rating: 5 out of 5. Duo is a stylish and unusual theme that will find much appreciation.

It's been a while since I used the sidebar on a website – I've allowed them to become unfashionable.

Duo is a theme that might just change that – Duo is the sidebar. Michelangelo has released another fully responsive MultiTheme and it's an unusual one.

Duo splits the screen down the middle. Two bold, vertical columns of content. If you – like me – have tended toward a multi-column-layout in the recent past, Duo will make you think again. Perhaps less is more. It certainly looks stylish.

The first thing you are going to want to do, is set the basic Theme Style for Duo. Not an easy thing to do, because there are 21 to choose from!  

You then have a choice of ten background images and of course, if you can't find one that you like, you can choose a flat colour or replace the images with your own.

If you like web fonts, Duo won't disappoint you – There are 20 Google Fonts to choose from too.

And then, of course, there's the sidebar. The standard setting of 50% width is Duo's most appealing feature. If you'd prefer a more conservative approach, you can choose from widths of 40%, 30%, the traditional 25% or – but I can't see why you would – switch it off altogether Your Duo-based website is going to look different from every other one – guaranteed.

If you are using RapidWeaver's standard pages – the styled text or the blog page, for instance – your content goes into the Sidebar editor. Text content is going to look rather bland in there, so I'd suggest one of two options – you'll either need to format your content using HTML, or you can place another RapidWeaver page into the sidebar using Pluskit.

duo

If you rely on Stacks to build your pages, life becomes a whole lot easier. Duo makes use of ExtraContent area [ECA} one for the sidebar content. Any stacks that you drop into ECA one, will automatically appear in the right hand column. And, rather than add a plethora of ExtraContent areas, Michelangelo has only added three. ECA two appears above the footer and ECA three above the main page, below the menu. The padding for ECA areas one (the sidebar) and two can be removed.

The RapidWeaver Gallery is complimented by PrettyPhoto, a jQuery lightbox and slideshow. The gallery is not the only thing that Duo can animate. 
Duo's pages have a fade-in transition that is active by default. It is a very smooth transition but if you prefer, it can can be deactivated. 
Michelangelo's Plus Code is included with Duo, allowing effects to be applied to text, images and font awesome icons. For instance Plus Code will allow page elements to fade in on page load; or fade, slide or bounce in when the page is scrolled. There is a whole page of examples on the MultiThemes website which include the necessary code. 

I found Duo simple to use, but it comes with a demo project that is sure to aid some users. 
Duo is one of the more innovative themes available today – it's a very aesthetic theme that will find a number of admirers.

Comments

Bloom – A new approach to your portfolio …

Bloom from Elixir Graphics, Review By Rob Hall, CEO at rjh Web Design Rating: 5 out of 5. Bloom is a stack that will display a portfolio that is unique to RapidWeaver.

The original idea behind Elixir's Bloom was a portfolio, but Adam's new stack is quite unique to RapidWeaver.

The result is an image next to a text block – and perhaps an info/purchase-button.
This sounds mundane. And it is mundane – until you hover over the image.

When you do, a magnifying glass appears. When you click, the image is enlarged to fill the width of the stack it is contained within. Again, that's not really new, except …
… Bloom not only displays a lightbox, but also a slideshow. You can drop up to ten images into Bloom's image well and can click through them once the lightbox appears.

Bllom

Bloom is very straightforward. You can set the number of images, round corners and can choose to place the image on the left or the right side of the stack well. 

The Icons (magnifying glass and navigation) may be set to white or black. They are visible by default when the user hovers over Bloom, but may also be set to display permanently.

If Bloom loads towards the bottom of the page. 'Scroll to top' will force the lightbox to scroll to the top of the page when it opens and 'Scroll Offset' will set the distance that the lightbox parks itself from the top of the page.

Bloom is fully responsive. This means that not only will both the image and the lightbox scale to fit the size of the containing stack, but if Bloom is placed in a narrower column, or viewed on a narrower screen, the content of the stack well will slide underneath the image.

The only downside for some users – images can not be warehoused – you drop a single image into the image well and it is used for both the thumbnail and the main display. You must therefore take care that the resolution is high enough, if the image is to be displayed as a full-page image.
The stack well will accept practically any stack. Its contents may, however, not extend below the image.

I rather like Adam's new stack. I can envisage using it not only to showcase my portfolio of websites or photographs, but also for business information and even catalogues. Heck, if I could work out a way of importing Bloom into this blog, I'd even use it here!

Comments

Rapid Ideas Reborn – Part i

For a long time, Rapid Ideas disappeared from the scene and we presumed that they'd joined the likes of WeaverAddons – gone; possibly never to be seen again.

As it turns out, Christoph's website has been overhauled and now looks cleaner than ever. There are even seven new stacks and a new theme online. News Grid, U Weather and Slide Overlay. Let's begin with those first.

News Grid is a new take on an old theme. Think RSS feed. What do you see? Right – a list of feed titles either animated or static. 

News Grid is, just as the name implies, a whole grid built with an RSS feed which fits responsively into whichever stack you've placed it. The grid will display not only the post's title, but some or all of the post itself – including images. This is not a stack that you're going to lightheartedly squeeze into the corner of a sidebar.

Once the stack was on my page, I found a multitude of options that allowed me to set the colours of the background container, frame colour, all aspects of text colours, etc. plus options to truncate the text and limit the number of posts pulled from the feed.

A refresh time can be set – the standard setting is 60 seconds - so that should a post be added to the feed whilst the page is open, the new post will automatically appear.

The date format can be set to relative (two hours ago) or absolute (publishing date) with various settings for the date format.

If you'd prefer the posts to be listed underneath each other, instead of in Grid Format, you can set the Layout to 'Simple' the posts will then fill the width of whichever column stack they are in.

Edit: If you want two or more feeds on a page, you can enter multiple feeds separated with commas. If you want to separate the feeds visually, you may add Two or more News Grid stacks to each page.

News Grid

U Weather

U Weather If you'd like to show your virtual visitors what they're missing, U Weather is a widget that will display the weather in any major city around the world. All you have to do is enter the city's name and, in some cases, country. Longitude and latitude may also be entered. Smaller towns are a little hit and miss, but that is not the widget's fault – the data comes from openweathermap.org.

U Weather will display in three sizes over an optional full-page background image with (also optional) a video overlay. Temperatures may be set to metric or imperial measurements. The language can be set and the colour of each element can be altered individually.

Slide Overlay is another interesting stack. Once dropped into your stacks page Slide Overlay gives you an image container and a stack-well. Anything you drop into the stack-well, will be displayed when the mouse hovers over the image.

The  Slide Overlay is not limited to text, so the possibilities are quite appealing. A sepia image can fade to full colour, or a second image may slide into view with a text overlay. An image mask to highlight an area of your picture …
The possibilities are only limited by your imagination.

I found a choice of twelve animation effects that can be set for the content change and there are a row of sliders that can alter the image's colour settings.

A word of warning, though – make sure that the content of your overlay isn't larger than the original image. Content overflow will be  hidden.

It looks as if Rapid Ideas has made a successful comeback.

Comments

Swap or Flip Your Content – Or Do Both

Tably from Yuzool, Review By Rob Hall, CEO at rjh Web Design Rating: 4 out of 5. Tably is a simple and lightweight solution for tabs.

There are probably half a dozen or more stacks available that will help you put responsive tabs on your webpage. Michael wanted something simpler, something lightweight, so he developed Tably.

The first thing I noticed when I placed Tably on my Stacks page, was the fact that the tabs are activated by checkboxes. The first checkbox 'Enable Tab 2' is already checked. So what happens if I deactivate Tab 2? — I get a box with a coloured button in its title bar – interesting. You can activate up to ten tabs.

Now the thing that I like about Tably is its simple responsiveness – when the viewport shrinks to below a defined width, Tably morphs into an accordion. Again, nothing new – that's already been done. Recently, I went to purchase just such a stack. The thing that prevented me from doing so, was the fact that the accordion was heavily animated – each time you clicked on a minimised tab, the whole page jumped up and down, even if the content length was identical.

When Yuzool's Tably is minimised the tabs simply substitute their content. Obviously, if the content is different in length, the tab container will change its size, but instead of an irritating, nervous animation the change can be a simple swap, or the content can fade out and in – your choice. 

The animation can be set to one of four different speeds and the tab content can automatically cycle – again, with four different speeds. Tably will also let you define which of the ten tabs automatically opens when the page is loaded.

The remaining settings are for Tably's background colours – the background can be deactivated – and for the button colours. The buttons are rectangular 'ghost' buttons. There are no other options to alter their appearance.

Tardis
QuickFlip

Tably arrives with a second, bonus stack – Toggle, a stack that will flip your content at the click of a button. You can drop any combination of stacks into Toggle, including Tably, and have their content displayed on demand. Michael's example page displays a price list for a subscription-based service. Toggle flips over to display Monthly or Annual subscription prices.

There are just two settings for Toggle – the button labels and the button colours.

Toggle is responsive. It's interesting that, instead of changing size when the screen narrows, the buttons turn into a dropdown.

Two stacks for the price of one — can't be bad!

Comments

Show more posts

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