I’ve been on the hunt for a good progress bar answer for some time now. Most of them are bundled in giant block libraries, requiring me to put in one other 20 or 30 blocks wherein I’ve no want. Others appear to overlook the mark completely with odd configurations and block choices. A few of the remaining plugins nonetheless use shortcodes and widgets, however it’s 2021. I’m searching for a block.
A few days in the past, the Tiles Progress Block landed within the listing. It appears to be a smaller piece of a bigger challenge named Tiles. I’ve been maintaining a tally of the group’s work since its preliminary design and patterns framework plugin launched final week. That challenge continues to be in beta, and solely time will inform if it turns into a aggressive challenge within the block house.
Nevertheless, the group’s new progress bar block was simply what I used to be searching for. Aside from one bug, which I reported to the developer, I discovered no severe points.
The plugin does what it says on the tin. It registers a Progress Bar block:
Out of the field, it contains Small and Massive types, permitting the person to regulate the dimensions of the bar.
Its power is that — I can not stress this sufficient — the block’s content material is editable inside the editor canvas space. This contains the label and share. It is a refreshing change from the numerous others that require customers to leap again into the block choices sidebar to alter easy textual content. As a result of the block makes use of Wealthy Textual content fields for its label and share, end-users can use inline formatting instruments like daring, italic, and extra.
The block additionally makes use of the usual typography and coloration palette controls from core WordPress. This gives entry to the theme’s font sizes and colours.
Plus, customers can select huge and full-width layouts, an usually neglected characteristic in block plugins.
Total, I’m digging this block plugin. If I had one characteristic request, it might be so as to add a border-radius choice. By default, the progress bar is rounded, however some customers may choose squared corners.
Extending the Block
Progress bars needs to be of measurable issues. For instance, steps somebody has taken in a web based studying course, share of whole donations acquired, and any variety of issues that may be counted are much more life like.
My favourite use of progress bars additionally occurs to be on my favorite novelist’s website. I wish to keep watch over Brandon Sanderson’s work, trying ahead to getting my subsequent literary repair (sure, I’m a fanboy).
At the moment, Tiles Progress Block doesn’t deal with that precise format. Nevertheless, as a result of it’s constructed on the block system and doesn’t do something out of the extraordinary, theme authors can change that with customized types.
And that’s simply what I did. My Sanderson-esque e book progress bars (tough, unpolished code available as a Gist):
The factor I like in regards to the block system is that themers can lengthen blocks on this method. There isn’t any useless checking for lively plugins, loading further per-plugin stylesheets, or determining every plugin’s distinctive system.
If a block is coded to the present requirements, theme authors merely have to hook in with their very own types. Customers can then choose these types through the editor and even make them the default.
I need to see extra of this from the block plugin ecosystem.