As a fan of Gutenberg and the block editor, I am always looking for ways to use it in lieu of the legacy page builder and even the Avada builder. For posts and KB articles, I only use Gutenberg and then use Avada to build the layout templates. This is similar to how many modern builders work — Oxygen, Bricks, etc.

Fusion element within a classic block

As I start to put articles into the KB, I realized there will be times when I don’t want to build an entire page just to demonstrate some technique. But how to demo the results? For simple things using the classic block with the Avada elements is the solution, but what about complex items — multiple elements, nested columns, etc? Enter global library elements and the shortcode block. As an example, I put together a CSS tip for creating a food menu. Since I wanted to show more than one element, I created a global column with nested columns, titles, and text, and then added the shortcode to the post.

Shortcode block with fusion shortcode

Originally published on Oct. 29, 2022

black and white balloons on white wallPlugin Spotlight: Heroic KB
two round white and gray plates on table with egg sandwichesFood Menu Demo

Leave a Reply

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

RELATED ARTICLES

  • Read Accordion Cards

    Accordion Cards

    Another custom accordion example using pseudo element.

    February 17, 2023

  • Read Adding Dynamic Data to a Toggle

    Adding Dynamic Data to a Toggle

    Adding dynamic data to a toggle in Avada is easier than you think.

    February 12, 2023

  • Read Hiding sticky header on scroll down

    Quick tip for hiding your stick header on scroll down.

    December 24, 2022

  • Read Customizing Toggle (Accordion) Headings

    In a recent project and for this site's new menu, I needed to change the default of the toggle heading and place the icon on the right side but not pushed the full width of the toggle panel. Fortunately, this is easy to do with a couple of lines of CSS.

    September 25, 2022

  • Read Remove dots under a required form label

    Ever been working on an Avada form, set the field to required, and then you start seeing spots? No, you're not seeing things.

    September 5, 2022

  • Read Remove RankMath Annoyance

    Remove RankMath Annoyance

    If you are a user of RankMath, I suspect you have encountered the annoying notification when you delete an item that is prompting you to set a redirect after you have deleted content. In and of itself, it is actually quite useful, but it doesn’t go away if you close […]

    September 3, 2022