Round-up | RapidWeaver Central | £Various
This is a stylish panel stack with a neat ‘sliding drawer’ that opens when a visitor clicks or taps a button. You can place pretty much any stack you like into the content areas, making this suitable for product pages, shops, accommodation sites, educational courses, in fact anything where you need a neat, ordered panel which can be clicked to reveal more information.
We experimented with headers, text, photos, YouTube videos, slideshows and social icons and everything worked like a charm. There are plenty of styling options – including button position, button icon (it supports the Font Awesome icon set) colours, rounded corners, shadow-on-hover, max height and minimum width – and the stack adapts well to smaller screen sizes, right down to an iPhone in portrait mode. A very useful and inexpensive stack.
This clever little combo stack lets you overlap an image on top of some text and then animates the image up when a visitor hovers over it with the mouse pointer or taps it with their finger. In addition, there’s a ‘Show More’ link built into the bottom of the stack which opens to reveal hidden content. A little like PlusThing, this makes ShowThing useful for sites that need to display information in a catalogue style and makes it easy to show visitors product highlights while also giving them the ability to drill down to reveal more information if they need it. The stack offers control over the background and border colours, border width, rounded corners as well as the colour of the Show More text; and the hover up effect is smooth and effective.
There are plenty of stacks around that let you produce a bulleted list using Font Awesome icons, but few that do it as elegantly as SimpleListThing. The stack provides controls for font size (which automatically adjusts the icon size as well) together with line height and padding; and there are global controls for colour, case, emphasis, letter spacing and text shadow. In addition, you can override the global colour on an item by item basis so that, for example, you can mimic the branding of Facebook, Twitter, LinkedIn and so on. You can also assign links to individual list items so the stack could be used in a footer or to provide some extra navigation, as well as simply offering a way to pick out a list of features or benefits. We’ve often found it difficult to achieve a good ‘fit’ with other list stacks – icons too high or too low, too big or too small for the text and so on – but SimpleListThing does a great job of this and makes creating bulleted lists quick and easy.
One of the simplest stacks here, HalfShadowThing subtly ‘lifts’ the top of any stack placed inside it, to produce a beautiful 3D shadow effect. In addition, when you hover the mouse pointer over the stack, the rest of the shadow fades into view to lift the entire content off the web page. There are almost no controls – though you can set the background colour and add rounded corners – but you can add an image to lay the stack against and then set both the card width and overlap relative to the image. This stack will be very useful if you need to add a nice, subtle effect that will enhance your web pages without getting in the way of the content.
This stack creates a frame for your content that mimics OSX’s Finder and program windows, so you get three dots at the top left – red, orange, green – and controls for colouring the top bar and the main content window. You can add your own text to the top bar and then drop a stack into the main content area, round the corners of the whole thing, and even add a snazzy blinking cursor to create an old-style PC-DOS screen effect. Add the ability to surround the whole thing with a 15px drop shadow behind the stack and you’ve got an excellent, ready-made way to present a call-out, customer quote or new product information.