The Banner Stack allows you to overlay stacks on top of a large image, of the kind you’d normally use as a banner at the top of your web pages — hence the name. Although there are a number of other methods — and paid-for stacks — that let you achieve something similar, there are few ways to do it more easily.
It works like this. Drop a Banner Stack onto your Stacks 3 page, drag in an image (or point to a warehoused one that’s stored on your server) and then click the ‘+’ icon to add your first overlay. Drag and drop a text stack into the new empty well and then preview the page and you’ll see that the Banner stack has added a panel at the top left of the image that displays your text. In essence, that’s all the stack does.
However, you get a lot of control over where the overlay is positioned, its colour and opacity – as well as the kinds of stacks you add to it. In this way you might use it to create a hero style header with a headline and call to action button, or include some descriptive text together with a few social icons, have them fade in via an animate stack and so on; you could even have a strip of thumbnails along the bottom that are linked to other images and locations on the site. It makes for an extremely flexible way of delivering content.
In addition, you can have more than one overlay, positioning, configuring and styling each one individually to create, for example, a header top left inside a semi-opaque panel with a 3px bottom border and a descriptive text box at the bottom right with the same opacity and a border at the top. Used with care, multiple overlaid panels like this are impactful and make great use of the available space.
Like many other Stacks4Stacks offerings, the Banner Stack is nominally free but donations are welcome. We think you’ll find it a useful addition to your Rapidweaver toolbox.