Yes, another stack that is called 'Events'. So until Michael thinks of a new name that will avoid conflicts, for the sake of this review, I'll call it FB Events.
FB Events is really simple to set up – just add the name of your Facebook page to the stack settings and your web page will always display your events in an exceptionally clean layout. The stack is so cool that I wish that I had events on my FB page. Sadly, I don't!
When you drag FB Events onto a stacks page and switch to preview mode, you'll find that it is already populated with events from the Globe Theatre in Stratford u.A. The initial view is a typical calendar view, but there is a switch above the calendar that allows you to switch to list view. And if you've added images to your FB event, the images will be displayed too.
FB Events can be matched to your theme colours and you can set the date range to be displayed, FB Events is, of course, responsive, but the calendar view doesn't display fully on mobile devices. To compensate there is a setting for Compact Mode for more confined spaces. (I would love to see the stack switch to compact mode automatically when viewed on mobile devices)
If you click on an event in either the calendar, or the list view, the event details that have been added to your facebook page are shown in their full glory.
FB Page ID
Layout – Full, Compact
View – Calendar, List
Switch – Show, Hide
Upcoming – All, Upcoming, Past
Title – Show, Hide (List View)
No. Of Events – Default 100
Time Format – 12/24h
Date Format – 5 options
Year Range – Number of years to be displayed
Year Before – True, False
Year After – True, False
Font – Helvetica, Theme
Highlight 1 – Colour
Highlight 2 – Colour
As already mentioned, FB Events is extremely simple to set up. There is no need to add any FB APIs, or IDs and the whole display looks really cool.
I'm off to think of some events that I can add to my FB page; and if you have the desire to add FB events to your site, you'll love FB Events too!
Let's say you have recipes online and you'd like your visitors to be able to cross off the ingredients that they already have and have the browser remember them. Or on your very private homepage, you'd like a list of 'Things To Do' before you publish an RW project. TaskList is an ingenious little stack even supports subheadings so that you can divide your recipe into Meat Dish, Sauce and Trimmings.
The possibilities are almost endless…
TaskList has extensive Style settings for the list itself and even includes options for the Checked Items such as Bold, Italic, Strikethrough, Opacity, Background Colour and Text Colour.
A ToDo List sounds so simple, yet it can be so configurable. Grab TaskList as part of RWExtra's Black Friday Promotion now!
A FAQs page immediately comes to mind, but Table Of Contents [TOC] can be used to build a complete page with article navigation.
TOC consists of two stacks and is simple to set up. Table Of Contents, the main stack, contains the complete setup for all TOC Article Child stacks, with the exception of the content type. The Content Type is individual for each child stack and can be set to Text (default) HTML, Markdown, or Stacks.
Once you've dragged the TOC 'master' stack onto your page, you can add title to the stack, then either drag in new content stacks from the Stacks' library, or simply click the + button to add a child stack. The TOC Content stack has a header area and a content area. When entering a header, it is automatically added to the contentlist.
The Content stacks may be dragged up or down inside the master stack, if you decide to change the order of your articles – the content list is then corrected accordingly.
It is possible to have more than one TOC stacks on your page.
When one of the Articles from the content list is clicked, TOC automatically jumps to that article and displays a progress bar at the top of the page. As you move down, reading the article, the progress bar indicates how much of the article has been read.
The clever thing about the progress indicator is – when you click the plus button at the top of the article, it opens the content list which now shows you which articles you have read and which articles you have yet to complete.
Once more, you will find an endless list of settings for TOC.
Suffice it to say that all aspects of the stack may be set to suit your preferences.
Background Colour, Icon size and colours, Header and Text Size and Colours, Line Height, and the list of Fonts that has become usual for 1LD stacks.
Listify is a set of three stacks that will help you build professional lists within your Stacks pages. The basic stack, Listify, is a container for individual List Items. You can either click the stack's + button to create a List Item child, or drag in a List Item stack. The third stack is Listify Group; a container that allows you to create groups of list and automagically builds responsive columns to contain them.
The clever thing about Listify is that you can drop anything into it that you please…
Lets take a basic list. Drop Listify into a stacks page and add a List Item.
The List Item Displays an Icon and a Text Field. Enter your text, add a new List Item – as many as you need – and you have bulleted list.
If you need a headline, you can either enlarge the text in the first Item (see the image below), or you can add a container to the Item and drop in a Header stack (hover over the image below). You can, of course drop in an image, or a button into the List Item Stacks and switch off the default icon and text display.
Each List Item may be formatted individually, or – by leaving the default settings – the completed list may be configured as a whole. Once you've studied the settings panel you'll find that the configuration is really simple.
Tip. If you wish to set up individually formatted List Items, begin with one Item. Once you have finished the basic formatting, duplicate the Item and then reconfigure. You'll find it a lot easier than setting up each Item from scratch.
The basic Listify stack provides the settings for the overall look and feel of your list. The List Fill Mode determines the width of your list – either Full Width (of the container it is placed in), or Pixel Width. The List Radius is set to a default of 5px whilst with the List Padding and the List Margins are set to 10px T, B, L & R.
The Background is set to Off by default, but may contain a solid Colour, a Gradient, or an Image.
Both the Borders and the Shadow are Off by default.
List Items (Shared Styles). The following settings will affect every List Item within the Listify stack:
Indent Direction (Left/Right), Item Indentation (px), Align Content (Left. Centre, Right, Separate (Icon & Text)), Item Spacing (default 5px), Item Radius (default 5px), Item Margin, Background and Border.
List Item Fonts gives you a choice of 13 standard Google Fonts, or (just to prove that 1LD listens to their customers) Custom. Text Size (px) and Text Colour.
List Item Icons (Shared Styles). Here you get to set the standard formatting for the icons: Vertical and Horizontal Positioning, Icon Padding and Spacing, Icon Radius and Icon Size. The Icon Background can once more contain a solid Colour, Gradient, or Image. Oh, and the Icon Colour itself, of course!
The default Icon is a Google Material Icons star. The icons are set individually for each List Item, with a choice of GMI's, Font Awesome, or Ion Icons.
Listify Item. The individual Items may be Linked to an external source. The next setting is Item Level. Each Item may be set to up to 10 (in words TEN!) Sub Levels! Excuse the overuse of exclamation marks (points if you're American) but this is amazing!
Next you have the option to Override Shared Styles. If this option is activated, each List Item may be individually styled. With the exception of Custom Stack Content and the Icon setting, the list of formatting options that follows is identical to those already listed above, including the individual visibility settings for the three screen sizes.
Finally, we come to the List Group stack.
As already stated, if you drop two, three, or more individual Listify stacks into a Group, your list is automatically columnised.
The List Group Stack also has some interesting features, though.
The List Alignment is set to Centred by default, but may also be set to Top, or Bottom. Then you'll find a setting Wrap List for Mobile Tablet (Portrait) and Desktop. Then there are settings for the group's Background – again None, Solid Colour, Gradient, or Image, Group Radius and Group Padding. The whole group may, of course be hidden at different screen sizes.
Hover over the image above, and you'll see just how flexible Listify really is – and that's without having added button stacks, or images!
Kool, or wot?
Pricing Tables is so simple to set up that if you have your content prepared, your first comparison table will be complete within mere minutes – you just need to work your way down the stack settings! The example below took less than five minutes to set up.
When you drop a Pricing Tables stack onto your RapidWeaver page, all you'll see is a box with a logo inside it.
Oops! 'What did I do wrong?' Was my first thought.
However, when I switched to preview mode, I discovered the same Pricing Tables on my page, as demonstrated on the RWtuts website.
Huh? I didn't do anything yet!
So let's take a look at the settings:
Columns Styling. Pricing Tables is set up to display the 'standard' three options that we see online on a daily basis. No amount of juggling will allow you to add just a single price table, or compare four options – it's "take it, or leave it". So after choosing a Font from a choice of ten options (the dreaded Comic Sans is also included), your next option is the column width, set in percentage of the container stack.
The next setting is Space (in px) and governs the spacing between the columns.Next up – Border width, BG Colour and Border Colour.
Header Styling. Set the Header Colour for Headers 1 through 3, the Font Colour and the Font Size.
Price Styling. Price Colour (actually the background colour which also formats the background behind the submit button) and Font Size.
Button Styling. Button Colour, Font Colour and Font Size.
Once you have your formatting set up, you can add your content. Moving down the settings panel you will find containers for the contents of each panel.
These include Title, Price, Descriptions 1 through 6, Button Link and Button Text.
Once you've added this content, you can go proceed to publish – your setup is complete already.
Pricing Tables is a minimalistic stack that takes the work out of building a flat comparison table. There are no bells, or whistles, with the exception of the fact that the column that your visitor hovers over grows a subtle shadow. The setup is simple and the results will suffice in many situations.
Links to the developers ® All trademarks cited on this page are the property of their respective owners.
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?
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.
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—16