We’re happy to announce Toolset Blocks 1.1.1. This release gives you everything you need to build beautiful and fully responsive designs with Toolset and the WordPress Block Editor.
It’s easiest to explain “responsive design” using an example. Look at our own homepage and how it’s improved with Toolset Blocks 1.1.1.
Control the appearance of any element for different screen sizes
See how the “phone screen” design for our homepage improved with Toolset Blocks 1.1.1:
The old design used the same font size for the header on both desktop and phone screens. You can see that while the header looks fine on desktop, it looked too large on a phone screen. The new design uses a smaller font size for tablets and even smaller for phones.
How did we achieve it?
Toolset Blocks 1.1.1 allows you to design every element for different screen sizes.
You will see the screen size selector when you edit any block coming from Toolset. Now, you can fully control the appearance of any block for different screen sizes.
Create responsive columns and grids
Columns are a big challenge on narrow screens. While several columns fit nicely on a desktop screen, on phone screens, typically only one column will fit. And since almost every design needs columns, it’s a big deal for responsive design.
Toolset Blocks 1.1.1 offers its own Grid block. You can use it for simple columns and for complex grids.
What makes Toolset’s Grid block so great?
You guessed right. The grid above is created with Toolset’s Grid block. View this post on your phone and see how it looks 🙂
Hide elements when they don’t make sense
Many designs use fancy (and pretty large) images. These images often look great on a desktop but don’t contribute much on phones. Toolset Blocks 1.1.1 allows you to hide any element on different screen sizes.
You can see that the big image that we’re hiding on the phone is really not needed. The design works better without it (less scroll to get to the point).
To achieve this, you’ll find a “Display” control when editing any element.
Switch to the target screen size on which you don’t want to show an element and hide it.
But wait. There’s more!
Once you’ve hidden an element, Toolset helps you remember that it’s there, just hidden.
Click on the reminder icon to edit the element’s settings. There, you can quickly unhide it.
Download and Update
We push out Toolset releases gradually. If your sites haven’t received this update yet, give it some time and you’ll see the update in a few days.
To skip the queue and get the update right away, to the Plugins –> Add New page, click the Commercial tab and then click the Check for updates button.
You can also download the plugins manually by going to your Toolset account and clicking Downloads.
Don’t forget to backup your site before updating.
Feedback? Questions? Suggestions?
Are you already using Toolset Blocks to build websites? What do you think about the new responsive features in this release?
Please leave comments with your questions, ideas, and suggestions and we’ll get back to you.