By Stephen Walker

As I continue to look at the possibilities of Gutenberg within the Avada theme, I came to a realization that aside from some of the bloated code and incomplete settings, the two together are a pretty formidable toolset. Add to that a tool like Meta Box All In One (AIO), and there are some fairly endless possibilities.

Rethinking the process

In a normal Avada implementation, you have a lot of power to build custom layouts, templates, elements, and widgets, but most are not transportable to another theme and you end up with a very limited set of options. What if you could change a big part of that?

This is where thinking about thing differently comes into play. Using Avada solely as a page layout tool and using Gutenberg to manage all the content. Honestly, this applies to almost every page builder on the market.

To make life easier two additional tools are added — Meta Box AIO and Editor Plus. The combination of these four tools really do make for almost unlimited web design platforms. So how do these work together in my mind?

Avada

As of right now, this is still my favorite page builder. Not because it is the most feature-rich (look to Bricks Builder or Zion Builder), but because I am very familiar with it and the adherence to WCAG (nobody else comes close yet). As a result of my familiarity, I can build a new layout in a matter of minutes. The layouts and library feature working together allows you to build a quick set of tools that can be applied in a variety of scenarios.

Meta Box AIO

Meta Box AIO is a custom fields and custom post plugin (it actually does so much more) that can allow you to define your content in almost any way. While the traditional post type works from most scenarios, you may need a specialty post type for your business or client. If you are an Advanced Custom Fields (ACF) user, you can use it and a custom post type tool.

Gutenberg

Originally, I did not like the new editor, but numerous enhancements have made it a really nice tool to work with. There is a bit of a learning curve and paradigm shift when authoring content, but in general, after the initial shock, I find it much easier to work with.

Editor Plus

This was a very recent discovery and overall usage of this plugin is very low, but what it brings to the table is amazing. As much as I like Gutenberg, one of the big frustrations I had was the lack of options for the various block elements. Editor Plus fixes this by adding almost every conceivable styling option for each element. I suspect this level of functionality will be added to Gutenberg in the future, but for now, this is a must-have plugin in my opinion.

Putting the Pieces Together

Hopefully, with these brief descriptions, you can get a sense of where I am headed.

Using Avada to construct a variety of layouts, gives you the ability to have very distinctive looks all within the same website. In my opinion, this is important for large, content-rich sites that might need a layout for technical posts, but something a little different for information, news, employee highlights, or user-level “how-to” articles while at the same time maintaining a common color palette or standard typography. I recently encountered something like this on the Adobe website where marketing posts and “how-to” posts had very distinctive differences. Once you have built these layouts assigning them is easy, but you could find yourself adding and excluding posts based on categories or tags, but what if you created a custom taxonomy called Layout. That is where Meta Box comes in. Creating a custom taxonomy takes about two minutes and opens the door for easy layout assignment — yes, Avada’s assignment system recognizes custom taxonomies and post types. Using the default editor allows you to add and layout the “content” the way you want and Avada’s “content” element just displays it. You can add any Avada element into the editor using the classic block although that may change in the very near future as the classic editor is going away with the release of WP 5.9 at the end of 2021. In addition to the Avada elements, you can add a free block library (e.g., Kadence, Qubely, Stackable, Getwid, Gutentor, etc.) that can add features not in Avada (table of contents, interactions, and advanced animations, etc.).

In the spirit of openness, this site has not yet taken full advantage of the features I mentioned, but that is primarily because I need all the Avada features available for demonstration purposes. All recent posts were author exclusively with Gutenberg and the same will apply to future articles. As the Avada Builder matures and elements become available as blocks, this may need to be revisited for pages.

Let me know if this helped or hindered your thinking.

Originally published on October 14, 2021

share the article

Leave a Reply

This site uses Akismet to reduce spam. Learn how your comment data is processed.

RELATED ARTICLES

  • New Feature – Quick Tips

    I have struggled to find the time to write full tutorials or even longer posts, so I am adding a Quick Tips category. This is similar to the news shorts, but almost every article will include code or a quick tip (imagine that) about an Avada setting or quirk.

  • Left Bar Separator

    Just using some custom CSS to create a color bar before a heading.

  • RSS and Avada

    RSS is an excellent way to get content to readers that don't have time to visit a hundred sites a day.

  • Borders and Boxes Demo

    Tryin to explain the layout fundamentals of Avada. Simple and not unique, but not necessarily intuitive for newcomers.

  • Conditional rendering – Oh the power

    In version 7.3 the ThemeFusion team added conditional rendering to the Avada toolset, but what they didn't do is explain all of the possible use cases.

  • Avada for the win – again

    In my apparently relentless pursuit of finding an alternative for Avada, I once again made my way around the builderverse and once again I am back to Avada.