Optic Stats stack | One Little Designer | $14.99
If you’ve wandered round Themeforest or any of the other WordPress theme libraries you’ll probably have come across a section in the demo site that shows a series of animated circular counters – perhaps displaying the number of satisfied clients the fake website has, or the number of fake sales it’s made that quarter.
The Optic Stats stack now allows you to acheive the same effect in your Rapidweaver site (though hopefully without the bogus underlying statistics). Start by dragging in the core stack to enable the stats’ animated features and after that, drag in as many actual Optic stacks as you need. You can define the colour and opacity of the animated gauge as well as the colour of the background circle, set your your units and separators, add a Font Awesome icon in front or behind the number and add a title to describe what information the gauge is supposed to represent. The result is a very effective way to communicate what might otherwise be a set of dry facts and figures.
The Optic Stats stack is responsive – though you may find you have to jig it around a bit to display nicely at certain breakpoints – and although there’s no built-in control over the fonts used for the units or title, you can always target these with a bit of CSS to use an alternative font; you can however position the font and alter its size directly from the stack’s controls as well as defining the size of the circle in pixels, along with the thickness of the animated bar fill. Finally, you can also switch to the ‘half circle’ option to cut the stack in half, which is useful if you want to position it hard against a footer or maybe an edge-to-edge extra content area. (If you choose this option, the stack automatically recalculates the percentage the animated bar should fill so there’s no manual re-adjustment required).
The Optic Stats stack does one thing really well, and is currently the only stack-based way we know of to achieve this effect in Rapidweaver.