While you’ve always been able to copy content easily from one page to another within an Avada site, a recently added feature allows you to copy and paste content across different domains. Read on to find out how this works, and watch the video below for a visual overview.

A very useful set of options can be found in the Container Element, on the General tab, just under the Visibility options. It’s the Container Publishing Status Options.

An easily overlooked Button Element feature is the Button Hover Transition option. This option is found at the very bottom of the Design Tab, and allows you to set specific transitions for your buttons on hover.

Flex-grow tells your column whether or not it can take up additional space within its wrapping container. Initially, the option will be empty, which means a default value of 0, and thus the column will not grow to take up any available space. With a value of 1 or higher, we are telling the column to grow and to take up the available space.

It’s easiest to explain this with an example. Let’s say you have three columns of 1/4 width. This means they take up seventy-five percent of the container. If nothing is set, then the columns will not grow and remain at 1/4 each, but if they all get a flex-grow value of 1, the remaining twenty-five percent is distributed equally among all three columns (an extra 8.333% for each one). But if you set a value of one on the first and third column, but a value of two in the middle column, then the browser would divide the remaining space by four (25% / 4 = 6.5%) and apply two units to the second column (13%) while the first and third column would only grow by one unit (6.5%).

To give another example, if you have a pixel width column, which size do you set to the neighboring sibling? To make it fill up the space it would have to be calc(100% – 200px) e.g., if the px width column had a size of 200px. This can easily be rectified by setting flex grow to the column instead.

The same applies if one of the columns changes its percentage width value from desktop to mobile. Then, flex grow on the other one would make that one adjust accordingly.

This option only works if the parent container’s Content Wrap value is set to No Wrap. By default, the containers are set to wrap, so if the columns take up too much space, the last one will simply be pushed to a new row. But, when Content Wrap is turned off, all columns are forced to stay on the same row. That could lead to overflow when there are some elements in the columns that can’t be reduced in width.

So, the Flex Shrink factor, similar to Flex Grow, lets the browser decide which columns can shrink more than others. Initially, all columns have a factor of 1, so if you set one of them to e.g. 2, it can shrink twice as much as the others.

Another important value is a Flex Shrink value of 0, which means the column must not shrink at all. For example, if you use a px width column, that will make sure, that regardless of available space, that column will always remain at its set px width. If Flex Grow is set on the same column, then it won’t shrink more than the overall width of its content.

There are times when it is helpful to paste Avada Element code directly into the page. For example, with Avada Sliders, you might want to paste button code into a slider. There are also several Elements in Avada that allow you to add further content inside them, through the WordPress editor. For example, there is the Toggle Element, the Tabs Element, and the Content Boxes Element, to name a few. If you wish to add further Avada Builder content into Avada Slider, or inside other Elements, we have a few tips here on the best way to achieve this. Read on, and watch the video below for a visual overview…

As mentioned before, there are some Elements, like the Tabs Element, that you can add content to through the Avada Element Generator. If you are just adding a single element, then you can use the Avada Element Generator, configure the element, and insert the shortcode directly into the containing element. But if you want a more complex layout involving columns, you can create that on a new page, and then copy and paste this into the editor within the parent Element.

Not every element that has the WordPress editor in it (and therefore the Avada Element Generator) is designed to have extra shortcode content. For example, the Title Element has an editor, but you can’t add a Gallery to a Title. So, some common sense is required here.

But any time you have access to the Avada Builder Shortcode Generator, you can, theoretically at least, add further Avada Builder Elements inside the parent Element. There is one golden rule with this process:

So, to create a more complex layout, simply create a new page, and using your preferred interface of the Avada Builder, create your desired layout using nested columns. When you are finished, you simply need to copy the Nested Columns Element itself (using the right-click feature) to copy the code into memory.

You can then return to your original page and paste your shortcode content into the editor of the containing element. This way, you will be inserting the nested column shortcodes that are needed, as well as the elements inside them, but not the container and column they are in.

The resultant shortcode pasted into the editor in the element then generates the desired layout, without needing to edit any code.