SelectNav is a free stack that is very useful. It places a single button on your Stacks page that, when clicked, expands into a list of links. SelectNav is especially useful if you have a very long list of page links or downloadable resources that you need to present to your end users as an easily accessible menu which is compatible with all web browsers.
The button itself may be formatted to match the colours used on your page and the link list – which can contain groups of links – floats over the page content when opened.
SelectNav supports keyboard navigation, is ideal for positioning in your sidebar and even works when it is in a lightbox. The stack can be set to autofocus on page load so that hitting the spacebar, or the up/down keys will automatically open the menu.
Once on your page, you can add either an option group child to group your links, or a SelectNav Item. Adding child stacks to the option group automatically adds a selectable item.
Autofocus – Disabled by default
Disabled – Disables the menu
Link Behaviour – Links Open In The Current Window (default), Links Open In A New Window Or Tab
Icon – FontAwesome
Width – Button Width
Disabled Item – Disabled by default
Selected By Default – Disabled by default
As already mentioned SelectNav is a free stack that turns out to be very useful.
Warning: This post contains explicit content that is unsuitable for minors
Please confirm that you are over 18 years of age
You have chosen not to view this post, but I'm going to show it to you anyway!
Displaying content promoting alcohol, or tobacco to minors is prohibited in many countries. Sexually explicit content, or disturbing content is also [or should be] restricted, Certain content such as flashing lights, rapidly changing images, or even flashing links, can invoke epileptic seizures.
You should be able to warn your visitors that what they are about to view on your web page may be harmful in some way.
Explicit, from Doobox was released just a week ago and helps you warn your visitors that your content may not be appropriate for all viewers.
Explicit's setup is simple. Drop the stack onto your page, add the warning text of your choice. Drop in a stack that helps explain the warning with text and/or images and publish.
When your page is loaded, it will display a modal with a warning, your description and two buttons which will allow you to confirm that you wish to view the page's content, or to decline.
If you confirm, the hidden page will be displayed. If you decline, a message of your choice will be displayed. After a few seconds the page will then refresh to display the initial warning.
Modal – Background Colour, Popup Colour
Title – Text Colour, Background Colour
Accept – Icon Colour, Background Colour
Decline – Icon Colour, Background Colour
Never Show in RapidWeaver – Hide in preview mode
There are two things to observe when using Explicit:
1 – I found that (at least on slow internet connections) the page content is momentarily displayed before the message appears, so it might be a good idea to position your explicit content below the fold.
2 – There is obviously no way of confirming that your visitor is, of course, actually of age, so those fourteen-year-olds are going to click 'yes, I want to see the naked ladies' and then discover that naked ladies aren't necessarily as attractive as they thought they might be,
Explicit is a simple stack that will warn visitors that the following content may not be suitable for them. It is not intended to confirm that a visitor is actually entitled to view the content.
Image Card. What does it do? It displays an image with a colour overlay, a text and a link icon.
But it does the above in a unique way.
Supposing you have an image gallery, or a portfolio, or you'd like a navigation grid to other pages…
Drop Image Card into a Stacks page and add an image to it. You can add a colour overlay and a title, or a short text – link is already provided – and you have a cool link box to your new page. It is even animated – the whole card moves up, or down when hovered.
Images scale within Image Card, to fit the longest dimension. But as you are able to set the card's height, you can make adjustments to the image display.
Fill Mode – Percent, Pixel
Alignment – Left. Centre, Right
Image – Drag & Drop
Mobile/Tablet/Desktop Height – px
Margin – Vertical, Horizontal
Padding – Vertical, Horizontal
Overlay Type – Gradient, Colour
Title Font – Choice of 14 Fonts + Custom
Mobile/Tablet/Desktop – Font Size, Line Height
Hover Icon Colour
Shift On Hover
Shift Amount (px)
That's a pretty impressive list of settings for such a simple looking stack and just goes to show how seriously Weavium takes their work.
What's more – Image Card is free!
Back To Top is the stack that you'll need if you wish to build attractive buttons to send a user back to the top of a webpage, but don't want to use Photoshop to build sprites and don't want to do any complicated programming .
A choice of customisable options lets you create a button of just about any shape, size, position and colour. And a useful 'view generated source code' setting lets you copy the generated code quickly for reuse in non-Stack pages.
Back To Top General Settings
Placement - Fixed (default) Relative,
Position – Top/Bottom/Left/Right
Offset – Page scroll before active
Back To Top Styling
Content – Font Awesome Icon
Content Colour (Normal/Hover)
Animation – Time ms
Sizing - Width/Height
Background – None, Colour Fill, Gradient Diagonal 1/2, Gradient Horizontal, Gradient Vertical (default), Gradiant Radial, Image (Dragged and Dropped), Image (Warehoused)
Top/Lower Fill – Normal/Hover
Border – Normal/Hover
The very first checkbox in the Settings panel is View Generated Source Code. When the checkbox is activated, the HTML, the CSS and the JS output for your button for your newly created button will be displayed in preview mode. A single click in any of these fields will allow you to copy the code necessary for your Back To Top button to be included within non-Stacks pages.
Without a doubt, a useful stack to have in your collection!
Press is an extremely versatile button stack that will allow you to create just about any button that you can imagine. Flat buttons are currently the mode (don't worry, fashions change and flat will be replaced by something else soon – and we'll find the new 'modern look' just as cool). 1LD acknowledges the current trend, so obviously, when you drag your first Press stack into a project, your new button will be flat and black.
Want flat with a very subtle gradient, or pill formed with a less subtle gradient, perhaps a patterned background? Not to forget Ghost buttons, of course – they're still semi fashionable; Press can do them all and more.
And Press doesn't stop at simple buttons, it can build button groups too. If you need to build a menu bar of your own, design the basic button that you'd like, drag a Press Group stack to the page, drag your button into it and duplicate it inside the Group as often as you need it.
If I go through all of the settings available in the two Press stacks, you'll still be reading next week.
Press has similar settings to previous 1LD stacks recently reviewed here. The settings groups are:
Button Initial State
Button Hover State
Button Active State
Advanced (Custom Classes)
Each of the above groups contains extensive settings.
Press Group contains settings for the Shared Button Styles – Group Radius, Button Margin and Button Padding.
Press group and the contained buttons are responsive, adjusting to all screen sizes. The only thing I miss is an option to display a hamburger on mobile devices.
You can read the full instructions for Press here.
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
Yes, I would like to receive your monthly newsletter.
No thanks, I’m good for now. I have a different issue.
[1-1], thanks for subscribing. If you made a further request, I’ll get back to you – typically within 24 hrs.
[1-1], thanks for contacting me. I’ll review your mail, and get back to you – typically within 24 hrs.
Thanks again for contacting us. Your request was successfully submitted.
Looking for Inspiration?
Looking for Inspiration for a new site, or need a CTA
The Latest & Greatest
Do you have a question regarding RapidWeaver?
Would you like help with your new project?
Would you like us to build your new RapidWeaver website?
265 Moo 2
Mae Na Toeng Nai, Pai
Mae Hong Son
We design websites and print-products for small businesses at reasonable prices. We specialise in Responsive Web Design.
We do not harvest or sell personal information.
© rjh web design 2010—17
Powered by rjh-design
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.