March 31, 2023 Feature Roundup
Current Theme Version: 5.20.66
Current Blocks Version: 4.7.12
Big changes for small screens.
While mobile versions of Dirigible sites have always looked great, we had accomplished that mostly by locking down options to make sure things looked buttoned up. After a few years of seeing how people have been using our sites, we felt confident we could add a few more options without sacrificing usability and uniformity.
You can find all these new options in Customizer → Header & Menu → Mobile.
The Menu Icon
Also known as the hamburger icon. While the default option works for most sites, we’ve added a bunch of different options for users who want to give their sites a little more personality.
The options we’ve included are Default, Thin, Lines, Vertical, Horizontal, Grip, Staggered, and Sort. Respectively:
We’ve also added a color option for your menu icon, so you can brand it any of your brand colors. This will automatically populate with choices from your site’s Palette, which can be found under Customizer → Styles → Palette.
Finally, we added some sizing options for you, so you can make sure your icon is the right size your users.
Have fun with it! We hope this gives you some more options to let your personality shine through your site. With more and more users using your site on mobile, we think its important to impart as much vibe as you can.
Close Icon & Drawer Open State
We didn’t stop with the Menu Open Icon, we also added a bunch of options for you change the appearance of your size when your mobile drawer menu is open.
We’ve included Default, Thin, and Circle options for the Close menu Icon. You can also adjust the size and color of this icon in the same way as the hamburger (open menu) icon. This icon defaults to white, but if you choose a light-colored overlay you will want to choose a dark color for this icon to ensure proper contrast.
One of the more exciting features for the ‘menu open state’ that we’ve added is the overlay color and opacity. This will automatically populate with choices from your site’s Palette, which can be found under Customizer → Styles → Palette. You’ll also get a pure black option, which will be different your branded black color (which usually has some color mixed in) that will just darken your background uniformly.
By combining a custom overlay with a custom icon, you can get vastly different looks for your mobile site.
FAQ Block: A usability facelift
The FAQ block was one of the first blocks that came to D5, and its remained largely unchanged from its inception. We’ve gone through and made some adjustments to the code to utilize new Gutenberg frameworks, so it should be way more intuitive to edit and create.
NEW: Mobile menu options galore. You can now choose:
Hamburger Icon style, size, and color.
Close Menu Icon style, size, and color.
Drawer menu width.
The overlay color and opacity when the drawer is open.
UPDATE: Mobile options have been moved to the mobile section of the header. Slight renaming of customizer panels to be more accurate and descriptive.
UPDATE: Better compatibility for gravity form stripe fields.
UPDATE: Allow scrollable mobile menus in case something goes really, terribly wrong with site hierarchy.
FIX: Fixed mobile menu drawer not appearing for odd breakpoint settings.
UPDATE: New layout for better comment readibility and ux on mobile.
UPDATE: Post prev/nav will be exactly half width, rather than expanding to fit text length.
UPDATE: Changed some editor css for alignwide.
IMPROVEMENT: Moved gravity forms to their own CSS file that only loads if it’s installed.
FIX: Compatible with new version of gravity forms.
UPDATE: dirigible.js no longer uses any jQuery!
UPDATE: Changed popup js to native js for speed.
NEW: Added option to manually change Popup transient in Dirigible Tools.
BACKEND: Moved templating for popups to its own directory.
BACKEND: Moved popup js to only load if enabled.
BACKEND: Added generalized tool scaffolding to make it easier to add tool modules.
Fixed pop up with a lot of content or very tall forms on mobile. This way users can actually exit out of it.
UPDATE: Revamped the FAQ block to be easier to use.
UPDATE: Added change image buttons to backgrounds, heros, and grids.
FIX: Fixed alignwide to be consistent in the editor.