avada-builder归档 - Avada 文档

How To Use Avada Studio

Avada Studio is an awesome design feature, that allows you to add pre-built, professionally designed content blocks virtually anywhere into your site. These content blocks are as simple as a single element, as complex as a full page template, and everywhere in between. New content blocks will also be added regularly, and they are easy to use and customize. This huge and ever increasing library of content will help you build your sites even faster, with top notch designs, right out of the box.
Read on to discover the different types of Avada Studio content, where to find them, and how to use them. And watch the video below for a visual overview.,avada.studioIt all starts at avada.studio. Here, you can see an overview of the Avada Studio content, and you can sort, browse and preview the full range of available content. The website is loaded with design inspiration, and will be updated regularly with new content blocks.
On the far left, you can see the eleven types of Studio content – Templates, Headers, Page Title Bars, Content Sections, Footers, Containers, Columns, Elements, Icons, Forms, and Post Cards. Next to this are the categories for that content type. You can sort the content blocks into their various styles to help you refine your selection. In the main window you can see a preview of the various content blocks. Just click on one to get a full width functioning preview of the particular block.
Rome wasn’t built in a day, and while there is a good amount of content to kick Avada Studio off, as the content grows, this will become an amazing source of design inspiration, all of which is also available to you directly from within your Avada website.,Avada Dashboard > StudioThe Studio page within Avada is available from the Avada Dashboard. You will have to have a registered copy of Avada to access this area. Like the avada.studio website, this area allows you to sort, browse, and preview the Studio content, but with the added ability to save your favourite content directly into your Avada Library.
This time the content types are arrayed across the top, but with the same sort and preview functionality as the studio website. The magnifying glass icon allows you to preview the individual content blocks, while the Library icon allows you to save content blocks directly into the Avada Builder Library for future use. You don’t have to save anything from here, as all the content is available to be added through the Avada Library when building your content in Avada Builder (with the single exception of icons). But it’s an easy way to save preferred content blocks as you are browsing.
New Avada Studio content will be added to this area as new designs are created, and there is also a Sync Avada Studio button at the top of the page to ensure you have the latest content.,Adding Avada Studio ContentAvada Studio Content Blocks are all added to your site through the Avada Builder, and the Avada Library. How you add Studio content depends slightly on the type of content it is. There are eleven types of Studio content, which can be gouped into six areas, covering every area of Avada. Let’s look at them separately.
Avada Studio Page TemplatesAvada Studio Headers, Page Title Bars, Content Sections & FootersAvada Studio Containers, Columns & ElementsAvada Studio IconsAvada Studio FormsAvada Studio Post CardsAvada Studio Off Canvas,Avada Studio Page TemplatesThese are accessed from a blank page, via the Avada Studio Button on the Starter page, or at any time on a normal page from the Avada Library icon on the Toolbar and then the Studio tab. These are full page templates.
To add this page template content, just mouse over the desired template and replace any existing content, or add it below or above any existing content. A dialogue appears, showing the import process, and the content appears in the builder.
One thing to note here is the Avada Library > Websites tab. This is simlar, but diffferent to Avada Studio Content. Both are full page templates, but here, you can import any of the individual pages from any of the eighty plus prebuilt websites. This area has also recently had a makeover, and with Avada 7.5, this content now imports with images.,Avada Studio Headers, PTBs, Content Sections & FootersThis type of Studio content is designed to be added to any one of the four types of Layout Sections, for use in Avada Layouts. If you are on a new Layout Section, you can add a prebuilt Studio Header, Page Title Bar, Content Section or Footer respectively, by clicking on the Avada Studio buton. You can also access the Studio Content at any time by opening the Avada Library from the toolbar and heading to the Studio tab.
These prebuilt, professionally designed Layout Sections can then be edited and customized to suit your content. Once you have completed them, just save them. To use them on your site, they would then need to be assigned to a Global or Conditional Layout at Avada > Layouts.,Avada Studio Containers, Columns & ElementsThis type of Studio content is designed to be added in the normal flow of building page content. When you add a new Container, Column or Element, just switch to the Studio tab, and there you will have access to the full range of the respective Studio content blocks.
This content can help you quickly build pages with great design and functionality, wthout having to build it all from scratch.,Avada Studio IconsIcon Studio content is a little different than the others. These content blocks need to be saved from the Avada Studio page, found at Avada Dashboard > Studio. Icon sets saved here are saved to the Icon page.
Then, you can access any of the icons in the imported custom icon set through any place were you find the Icon picker. Many Elements have an icon option, as well as the Icon Element. Just look at the sets across the top of the Icon Picker and you will see any custom icon sets that have been added to Avada.,Avada Studio FormsAvada Studio Forms can be saved directly to the Forms Builder page from the Studio page, but these can also be added when creating a new Avada Form. Just click the Avada Studio button from the Form Builder starter page to access the Studio forms, and add your preferred form. You can also acess the Studio tab through the Library when there is content on the page.
Of course, the imported Studio forms will need to be customized for your content and submission preferences, and then once they are finished, you can add them into your content with the Avada Form Element.,Avada Studio Post CardsAvada Studio Post Card content is added in a similar way. You can save Post Card Content directly to the Avada Library from the Avada Dashboard > Studio page, or when building a new Post Card.
There is no Starter Page when adding Post Cards, so the way to access Studio content here is to access the Avada Library and add a Post Card from there. These Post Card designs can be used directly as they are, by inserting them into your Layout Sections with the Post Card Element, or they can of course be first customized to suit your needs.,Avada Studio Off CanvasAvada Studio Off Canvas content is the latest addition to Avada Studio. You add Off Canvas Studio Content directly from the Starter Page of the Avada Off Canvas Builder.
There is a range of Off Canvas designs for you to load, from Popups, and various types of Sliding Bars.,ConclusionWe think Avada Studio is a real gamechanger for Avada users. This rapidfire way of deploying professionally designed content into your site will speed up your workflow immensely, and also ensure your designs are of the highest standard.

The Avada Live Workspace

Editing in a Front-End interface is a new way of working for many. With Avada Live, we have designed a modern and unobtrusive workspace that stays out of the way as much as possible. This minimalist approach allows you to see your content and layout clearly, while still giving you access to the tools you need to quickly build your website.
Read on to have a look around the new Avada Live Workspace, or watch the video for a visual overview.,Overview
The Toolbar

Avada Live Workspace

Element Control Icons

Color Coded Element Controls

Editing With The Element Controls

Inline Editing

Preferences & Shortcuts

Navigation

Page Areas Outside The Builder

Conclusion,The ToolbarThe Toolbar runs along the very top of the page in Avada Live. This provides access to many page building tools, in much the way it does in the back-end builder. It is also sticky, so it always remains at the top of the page as you scroll, providing constant access to its important functions. Let’s have a look at this central component of Avada Live.
Left Hand Side
Avada Icon: This has no direct function. Mouse over this icon to see the current Avada version.

Toggle Sidebar: This opens and closes the Sidebar, where you can access the Global Options, Page Options, and the Element Settings.

Library: This accesses the Avada Builder Library.

History: This shows the latest 25 history states, allowing you to step backward throughout your actions.

Preferences: Here you can access the Avada Live Preferences.

Add New: This icon allows you to add a new Post, Page, Portfolio, FAQ, Layout or Element.

Clear Layout: This clears the layout from the page.
Right Hand Side
Support: Offers links to our Getting Started documentation, our Support portal, and the keyboard shortcuts available.

Responsive: This is now a dual purpose tool. Here you can preview the page in responsive modes, in desktop, tablet and phone preview. But this is now also a Responsive Editing Mode, for use with the Responsive Option Sets feature.

Toggle Wireframe: Click this icon to toggle the back-end wireframe in the Front-End Builder.

Preview: Preview mode closes all panels and removes front-end icons to give you a quick, clean page preview.

Publish / Draft: These two buttons allow you to quickly set the publish state of the page, to Draft or Published.

SAVE: The Save Button allows you to save all the work done in the Front-End Builder, including edits to Elements, and theme and page options settings.
Exit: The Exit Button allows you to exit the builder, to the page front-end, the page back-end, or the WordPress dashboard.,Avada Live WorkspaceWhen you are first in Avada Live, the only things that really differentiates it from a front-end page is the Toolbar along the top, and the few icons overlaid on the content. It is when you mouse over these icons, that you can fully see and access the Element Controls.
There are Controls for every part of the page that can be edited. There are Container Controls, Column Controls, and individual Element Controls, as well as Nested Columns and separate controls for both Parent and Children items in Elements that use this structure. Just mouse over a content area and you will see the Element Controls for whatever content is there.
Take a good look at the image below. In this example, we have moused over the Content Box on the far left, and we can see a number of Element Controls:

Individual Content Box Element Controls – Illustrated as A

Content Boxes Parent Element Controls – Illustrated as B

Column Controls – Illustrated as C

Container Controls – Illustrated as D

‘Add Element’ Icons – Illustrated as E – Two Add Icon also show on the screen, as those particular columns are empty and are, as such, easily missed.,Element Control IconsWhen you mouse over a Container, Column or Element you see the Element Controls. The initial view consists of a Settings Icon (the pen icon) and an Add Icon (a Plus icon for Elements, and a Column or Container Icon respectively for Columns and Containers.) See the image below for the initial view of all Element Controls.
When you mouse over a control, it expands to show the full range of controls for that item. The majority of these controls are the same for all items, although there are a few specific to the item. For example, all items have Edit, Add, Clone, Library, Delete and Drag icons, with the exception of child elements and individual columns inside a Nested Columns Element, which can’t be saved independently to the library, and so don’t have the Library icon. Also, Columns have an additional control to change the Column Size.
In the image below, you can see the Column Controls, Element Controls and Container Controls.
Column Element Controls
Column Options – This opens the Column Options Panel in the Sidebar, where you can then configure the Column as you wish.

Add Columns – This opens the Add Columns dialog, where you can add any a range of Column sizes and combinations to the parent Container.

Column Size – This opens the Column Size dialog, where you can change the size of the selected Column to anything from 1/1 to 1/6

Clone Column – This duplicates the Column, which is then added directly below the Column cloned.

Save Column – This opens the Library dialog to the Columns tab, where you can save the selected Column.

Delete Column – This deletes the chosen Column from the layout.

Drag Column – This turns the cursor turns into a clutching hand, and you can begin to drag the element around the screen. In fact, any time you see the hand icon, you can drag your content around the page, and guidelines will appear to show you the possible move locations. For more information on this, please see Cloning, Copying & Moving Elements in Avada Live.
Element Controls
Drag Element – This turns the cursor turns into a clutching hand, and you can begin to drag the element around the screen. In fact, any time you see the hand icon, you can drag your content around the page, and guidelines will appear to show you the possible move locations. For more information on this, please see Cloning, Copying & Moving Elements in Avada Live.

Clone Element– This duplicates the Element, which is then added directly below the Element cloned.

Element Options – This opens the Element Options Panel in the Sidebar, where you can then configure the Element as you wish.

Add Element – This opens the Add Element dialog, where you can add any of our Elements to the Column. It will be added directly under the Element you add from.

Save Element – This opens the Library dialog to the Elements tab, where you can save the selected Element.

Delete Element – This deletes the chosen Element from the layout.
Container Element Controls
Drag Container – This turns the cursor turns into a clutching hand, and you can begin to drag the element around the screen. In fact, any time you see the hand icon, you can drag your content around the page, and guidelines will appear to show you the possible move locations. For more information on this, please see Cloning, Copying & Moving Elements in Avada Live.

Delete Container – This deletes the chosen Container from the layout.

Save Container – This opens the Library dialog to the Containers tab, where you can save the selected Container.

Clone Container – This duplicates the Container, which is then added directly below the Container cloned.

Container Options – This opens the Container Options Panel in the Sidebar, where you can then configure the Container as you wish.

Add Container – This opens the Add Container dialog, where you can add an empty Container, or one with any possible combination of Columns already inside.
767,650 Businesses Trust Avada
Get Avada767,650 Businesses Trust Avada
Get Avada767,650 Businesses Trust Avada
Get Avada,Color Coded Element ControlsDepending on the type of page content you are editing, you will also notice some different colors on the Element Controls. This is to help differentiate content at a glance.

Normal Page Content – Blue

Global Items – Cerise

100% Height Scroll Items – Orange

Nested Columns – Dark Blue
Normal Items – Blue
Global Items – Cerise
100% Height Scroll – Orange
Nested Columns – Dark Blue,Editing With The Element ControlsWhen you edit the Options of a Container, Column, or Element (the pen icon), the Element Options panel opens in a Sidebar on the left of the page. If you prefer, you can change the Element Editing Mode setting in the Avada Live Preferences so that it opens in a standalone dialog instead. Once you have set your preferred working position, it will open in that area from then on, unless you change it again.
Now you can edit your element as you would in the back-end editor, with the main difference being you can see the element at the same time, and any changes you make to the element are reflected in real time on the page.
Depending on the Element you are editing, you will have a range of options and tabs which to configure the Element with. Your changes will be visible on the page immediately. When you have completed editing the element, you can just move on to the next Element. There is no Save button at the bottom of the Element Options, as there is now a Global Save button in the top right corner of the Fusion Builder Live Editor. Simply click Save there whenever you wish to commit your changes. Note that this will clear the History States.,Inline EditingWorking with text is a little different. With the Title And Text Block elements, and in fact any elements that have a text component, you can edit directly on the page without the need of any element dialog. Simply click in the text where you want to edit, and start typing. Also, if you select some text, the Inline Editing dialog appears.
To fully understand Inline Editing, please see our Best Practices for Inline Editing in Avada Live document.,Preferences & ShortcutsYou can customize the Avada Live Workspace to some degree, by setting your preferences. This is found in the main Toolbar, under the preferences icon. As you can see from the image below there are a number of preferences you can set, including the position of the Sidebar, and whether the Element Edit controls open in the Sidebar on in their own dialog.
There are also a range of shortcuts that can speed up your workflow in Avada Live. These can be found on the Toolbar under Support > Shortcuts.,NavigationIn Avada Live, you don’t need to return to the WordPress dashboard to navigate to new pages. Once you have edited and saved a page, you can simply navigate to another page using the main menu and keep editing. If the Header Icons are blocking the menu, just click on the Preview Icon and then you can see the menu without any icons interfering.
You can also navigate to other linked page on buttons by holding down Cmd/Ctrl while clicking on the button.
When leaving Avada Live, the Exit Icon gives you three choices – to leave to the page front end, the back end, or the WordPress Dashboard.,Page Areas Outside The BuilderThere are also areas of the page that are not directly editable in Avada Builder, as their content is generated via the Global Options, or other areas of WordPress. (You can easily see these areas see when using the Wireframe View). These are areas like the Header, the Footer, Sidebars, and Sliding Bars.
In Avada Live, we have added a series of icons to these areas, to enable fast access to these areas in WordPress or Avada to make changes.

Header Control Icons (from the left): Edit Header Layout, Edit Logo, Edit Main Menu, Add Slider, Add Page Title Bar. If you have a Page Title Bar or Slider on the Page, these icons will not be on this bar, but instead, relevant icons will be on the Page Title Bar and Slider respectively.

Header Layout – If your site has a Custom Header Layout, then there will be a single icon to enable you to edit the active Header Layout Section directly from the page. This will be the same for Page Title Bars, and Footers.

Footer, Sidebar & Sliding Bar Control Icons (from the left): Edit Footer, Edit Footer Widgets,ConclusionAs you use Avada Live, the workflow and controls will quickly become logical and evident. The beauty of the design of this front end builder is that it stays out of the way as much as possible, yet everything you need is right at your fingertips.
Watch our Avada Live videos and read our full range of Avada Live documentation for more information, and if you need to, you can always submit a support ticket, and we will be glad to assist you.

Using The Avada Live Wireframe

A very useful new feature in Avada Live is accessing the wireframe editor while editing on the front end. If at any point in your editing process, you want to see the wireframe and/or edit using the back-end editor while still being in the front-end editor, you are in luck. Watch the video, or read on to see how this feature works…,How To Access The WireframeWhen you are in Avada Live, you will see the Wireframe Toggle icon in the Toolbar at the top of the page. It is the third one on the right-hand side, as seen in the image below. Click on this to view the wireframe, in place of the live content. Just note that headers, footers, and sliders, etc will remain in live view, as these are not created in the page builder.
Using The WireframeApart from being useful to orient yourself, as you transition from back-end to front-end editing, you can also edit your page in this hybrid mode, just as you would with the back-end editor, but just from within the front-end interface. You can do everything you can in the back-end editor, from creating, moving and naming containers, through to full editing of their contents. It truly is the best of both worlds.
Editing Elements Using The WireframeOnce you have the wireframe open, editing an element opens the Element Options panel in the Sidebar. This panel has identical contents as when you are editing elements in the back-end. Simply make your changes you can save your changes to the page at any time by clicking the Save Button at the top right on the Toolbar.
To exit the wireframe view, just click on the wireframe icon once more, and you will be returned to the standard workspace in Avada Live.

Avada Builder Custom Post Types

In the Avada Builder general options, you can choose which custom post types you can enable or disable the Avada Builder on. This will allow you to control the areas where Avada Builder can be used. To learn how how to enable or disable the Avada Builder on custom post types, please continue reading below. If you’d like to learn more about the Avada Builder’s other options, please follow the link below.
Learn More About The Avada Builder General OptionsHow To Enable/Disable Avada Builder On Custom Post TypesStep 1 – Navigate to the Options > Builder Options from the Avada Dashboard.
Step 2 – Down the page, you’ll find the ‘Post Types’ section. What you see here will depend on the plugins you have installed. Some third party plugins, such as the Event Manager and WooCommerce install their own custom post types.
Step 3 – Check the corresponding post type checkbox to enable the Avada Builder on it. You can also choose to uncheck it to disable the Avada Builder instead.
Step 4 – Once finished, click the ‘Save Settings’ button.

Avada Builder Element Generator

The Avada Builder Element Generator allows you to add Avada Builder Elements directly from the WordPress editor. You can use this tool in a variety of ways. It lets you insert Inline Elements into your text content, and you can even insert Elements inside other Elements!
You can access the Avada Builder Element Generator in the WordPress Editor toolbar, which means you can access the Element Generator in any Element that has a WordPress Content Editor, such as the Text Box, Title, or Checklists Elements to name a few.
IMPORTANT NOTE: The Avada Builder plugin must be installed and active in order to access the Element Generator.,How To Use The Element GeneratorStep 1 – Activate Avada Builder, or Avada Live.
Step 2 – Insert a Container on the page, then select your desired column layout.
Step 3 – Insert any element that has a WordPress Content Editor by clicking the ‘+ Element’ button on any column. For example, the Text Block element.
Step 4 – Click the ‘Edit Settings’ icon on your chosen Element to bring up its options window.
Step 5 – On the WordPress Content Editor toolbar, find the Element Generator which is represented by an Avada Logo icon.
Step 6 – Clicking the Element Generator icon will bring up the Elements window. Here, you’ll find the Inline Elements. You can also insert standard Elements inside other Elements, but please keep in mind that some may not be compatible with each other. For example, you might insert the Tab Element, and then add 3 tabs. Then inside each Tab Content area, you might click on the Avada Builder Element Generator to add a Woo Featured Product Slider Element. See the Featured Products at the top of the home page on the Classic Shop Demo for an example of exactly this usage.
Step 7 – Select your desired element to bring up the options window. Configure the element and then click ‘Insert’ to insert it into the WordPress Content Editor.
Step 8 – Click ‘Save’ on the main element to save all your changes.,How To Use The Element Generator In Avada LiveUsing the Avada Builder Element Generator in Avada Live is essentially the same process. When you add any Element that has a text based component, and therefore has the WordPress Editor in its options, you will see the Element Generator Icon in the Editor toolbar. The only difference is that the editor will be in the Sidebar, unless you have changed your preferences to edit Elements in a freestanding dialog.

Avada Builder Elements Search

How To Use The Element Search FeatureStep 1 – Activate Avada Builder or Avada Live.
Step 2 – Add a new Container, then add columns into it. Click the ‘+ Element’ button to bring up the Elements window.
Step 3 – In the ‘Select Element’ window, there’s a search field on the upper right corner of the window. This is active immediately when opening the Element window.
Step 4 – In the search field, type in the keywords for the element you’re looking for. For example, button. This search method is a LIVE search, thereby elements will be filtered and displayed as you type.

Avada Builder History Feature

The Avada Builder includes a useful feature called History. This feature tracks the last 25 actions that have been performed in the editor and allows you to revert back to any state before or after an action. To learn how to use this feature, continue reading below.
IMPORTANT NOTE: This feature is only available in Avada 5.0 and up.Read About Avada Builder’s Tools and IconsHow To Use The History FeatureStep 1 – Activate Avada Builder, or Avada Live.
Step 2 – Create your page layout as you’d like. Each action you make is recorded under the History icon as a history state. In the back end editor, the History Icon is found on the right uppermost corner of the Avada Builder toolbar. In Avada Live, the History Icon is on the left side, the 4th icon along on the toolbar.
Step 3 – Once you click the ‘History’ icon, you’ll see all your actions in a list. To revert to a particular history state, simply click the history state in the list. You can jump between any history state in the History list as often as you wish, until you save.
IMPORTANT NOTE: Saving or refreshing the page will reset your history states.

Avada Builder Options

The Avada Builder has a vast array of options that allow you to configure the Builder to suit your preferences and website environment. These options include activating and deactivating the Avada Builder on custom post types, enabling or disabling any of the Avada Builder Elements to improve performance, and exporting or importing your Avada Builder settings. Continue reading below to learn more about these options.
OverviewHow To Access Avada Builder OptionsAvada Builder Auto Activation
Disable/Enable Avada Builder Elements
Activate/Deactivate Avada Builder on Custom Post TypesImport/Export Avada Builder Content
Avada Builder Elements Customizations,How To Access Avada Builder OptionsBefore you can access the Avada Builder Options, you must first install and activate the Avada Builder Plugin. Once this is activated, navigate to the Avada Dashboard and head to Options > Builder Options. Here, you will find all of Avada Builder’s available options. Customize these options to your liking, then click ‘Save Settings’ to save your changes.
Read our Avada Builder Plugin article!,Avada Builder Auto ActivationThe Avada Builder Auto Activation option allows you to enable or disable the Avada Builder user interface by default when creating or editing a page, or post. When active, the Avada Builder will automatically load when creating or editing a new page or post. Otherwise, the default WordPress content editor field will be displayed. Simply toggle the option to On to enable, or Off to disable.,Disable/Enable Avada Builder ElementsIMPORTANT NOTE: Use with caution! Disabling an Avada Builder Element will disable it from all existing pages or posts. Disabled elements will render as regular code snippets on the front end.Under the Avada Builder Elements section, you’ll find a checklist of all existing Avada Builder Elements, including Design Elements, Layout Elements and Form Elements. If you are not using a particular Element on your website, you can disable it here. Disabling individual Avada Builder Elements can slightly increase performance and load speed. Please be aware though, that disabling an Element will disable it on all existing pages or posts. Any disabled Elements that have been used across the site will render as code snippets, so make sure you haven’t used it anywhere before disabling it. To help with this, the Run Element Scan option was added in Avada 7.3.
Run Element ScanThe Run Element Scan button does exactly what it says. It scans the website, and finds and disables the Elements which are not in use. You could use this feature when you are finished with a website, to easily find the disable the Elements you are not using. Just note, that this feaure may not fully run on large websites with a lot of content.,Activate/Deactivate Avada Builder on Custom Post TypesUnder the ‘Post Types’ section, you’ll find a checklist of all your existing custom post types. What you see here will be depenedant on the plugins you have installed. Using these options, you can activate or deactivate the Avada Builder on any of your custom post types. Simply check the checkbox of the custom post type you’d like to activate the Avada Builder in, or uncheck to disable it.
Learn More About The Avada Builder On Custom Post Types,Import/Export Avada Builder ContentYou can also export your entire Avada Builder settings and content which you can use as a backup, or import to another Avada installation.
ImportingTo import your Avada Builder content, simply browse to and select the XML file with your saved content and click the ‘Import’ button and wait for it to finish loading.
ExportingYou can choose to export your entire Avada Builder content (saved containers, columns, or elements), or just your full page templates. Simply click the appropriate button and an XML file containing your saved content will be downloaded to your computer.,Avada Builder Elements CustomizationsIf you’d like to customize each Avada Builder Element globally, you can do so by going to the Avada > Options panel, then switching to the Avada Builder Elements tab. On this tab, you can globally customize each element to your liking. If you’d like to customize each Avada Builder Element individually, then you can do so by editing the individual Element while building your page or post.
You can also access these Element Global Options when you are in Avada Live. Simply click the Toggle Sidebar icon on the Toolbar, and choose the Global Options Tab. Scroll down to the penultimate option, called Avada Builder Elements, and here you can also set the global defaults for the Elements.

Avada Builder Quick Start Guide

The Avada Builder is ThemeFusion’s very own page builder, now available in both front-end and back-end interfaces. With this fully featured, and easy to use page builder, you can build complex layouts without any coding knowledge at all.
With the release of Avada 6.0, we introduced ‘Fusion Builder Live’, an awesome companion to the traditional wireframe builder. In Avada 7, Fusion Builder Live was renamed to Avada Live.
Read on below to get an overview of the Avada Builder, and for links to many Avada Builder resources.
Learn More About ‘Avada Builder vs Avada Live’,The Avada Builder Creation ProcessRegardless of whether you are editing with the traditional Avada Builder wireframe editor, or Avada Live, the creation process is the same. You always start by creating a Container. Then you add columns to the container, and then finally, add Avada Builder elements to the columns. This makes your content easier to organize and allows for maximum compatibility. To get a full description of the building process, see the ‘How The Avada Builder Works’ link below.
Learn About ‘How The Avada Builder Works’767,669 Businesses Trust Avada
Get Avada767,669 Businesses Trust Avada
Get Avada767,669 Businesses Trust Avada
Get Avada,Avada Builder Tools & FeaturesThe following documents are about the Avada Builder’s tools and features, and how to use them.

Avada Library – With the Avada Builder Library, you can save and redeploy all types of page content, from elements, columns, containers and even full pages.
History Feature – Redo and undo almost any action you’ve done while building a page with Avada Builder with our new History States feature.
Right-Click Feature – With the Avada Builder right-click feature, you can access many commands and Library functions very easily.

Nested Columns – You can now insert columns within columns to build more intricate and flexible page layout designs.

Element Search Function – Never have difficulty finding an element again with the new Element Search Function.

Custom CSS Per Page – Insert Custom CSS per individual page for even more in-depth design and customizations.

Avada Builder Starter Page – This is the starter page that you’ll encounter when building a new page with the Avada Builder.

Avada Builder Visibility System – Easily control which Avada Builder elements are visible on different device sizes.

Avada Builder Tools & Icons – To build pages with ease, it’s important to become familiar with the Avada Builder’s tools and icons.
Avada Builder Import Prebuilt Website Pages – Import any page from any prebuilt website with just one click!
Advanced Options Network Correlation – Quickly view and change Global Options.

Adding Elements – If you are the developer type, you can also learn how to add Avada Builder Elements in Avada Builder.

Responsive Option Sets – In Avada Builder, there is now an awesome feature to help you design for different screen sizes, using the same Elements.,Avada Live Docs & VideosThe following documents specifically explore Avada Live.

Avada Live Workspace – This document looks at the Avada Live Workspace in detail.

Avada Live Global Options Management – This document looks at how you can access many global options directly from Avada Live.

Avada Live Local Options Management – This document looks at how you can access many local options directly from Avada Live.

Using The Avada Live Wireframe – This document looks at the Avada Live Wireframe view, and how to use it.

Best Practices for Inline Editing in Avada Live – This document looks at Inline Editing in Avada Live, and covers the best practices for its use.

Cloning, Copying & Moving Elements in Avada Live – This document looks at how you can clone, copy & move elements around in Avada Live.

Adjusting Margins & Padding in Avada Live – This video looks at new methods to adjust margins & padding in Avada Live.,Technical & TroubleshootingThese document articles are about the Avada Builder’s technical features. This list includes articles about converting pages created using the old Avada Builder, the Avada Builder’s settings, and the like. Please read these articles to learn more about the Avada Builder’s technical features.

Avada Builder Options – The Avada Builder has its own options, that enable you to optimize it to suit your needs.

Add On System For Developers – Create your own add-ons and contribute to the Avada Builder Library and Elements collection!

Avada Builder Right Click Options

A small, but awesome feature, that was added back in Avada 5.6, is the ability to manage your Avada Builder Elements, Columns, and Containers through a right click menu.
When you right click within the Avada Builder, or within Avada Live, a contextual menu appears, with options for you to edit, clone, save, remove, copy, and paste elements. This provides easier element interactions and improves your workflow efficiency. Continue reading below to know more about the options available in the Avada Builder right click feature, or watch the video below for a visual overview.
Right Click Feature MenusThe Avada Builder right click feature gives you largely common choices for the various assets. The main differences are the paste options for Elements vs. Columns vs. Containers. Please see below examples of what the menu looks like, and the list of the options available, when you right click on Containers, Columns, or Elements.
Avada Builder Container Right Click Options
Edit – this will open the Settings of the specific Container where you can customize it.

Save – this opens the Library window, where you can save the specific Container, as a normal or a global Container.

Clone – this will clone the specific Container and place the cloned Container directly after its original.

Remove – this will delete the specific Container from your layout. If you delete an element by mistake, you can use the History feature to undo it. For more information on this, view the History Feature document.

Copy – this will copy the specific Container. Once a Container has been copied, paste options will be available when you right click on a Container again.

Paste At Start – this option is only available in Columns and Containers. If you copy an Element, and right click on a Column, it will paste the copied Element at the start of the Column, or if you copy a Column and right click on a Container, it will paste the copied Column at the start of the Container.

Paste At End – this option is only available in Columns and Containers. If you copy an Element, and right click on a Column, it will paste the copied Element at the end of the Column, or if you copy a Column and right click on a Container, it will paste the copied Column at the end of the Container.

Paste Before – You will get this right click option, when you copy an Element, Column or Container, and then right click on the same type of element again. This will paste the copied item before the item you have right clicked on.

Paste After – You will get this right click option, when you copy an Element, Column or Container, and then right click on the same type of element again. This will paste the copied item after the item you have right clicked on.
Avada Builder Column Right Click Options
Edit – this will open the Settings of the specific Column, where you can customize it.

Save – this opens the Library window, where you can save the specific Column, as a normal or a global Column.

Clone – this will clone the specific Column and place the cloned Column directly after its original.

Remove – this will delete the specific Column from your layout. If you delete an element by mistake, you can use the History feature to undo it. For more information on this, view the History Feature document.

Copy – this will copy the specific Column. Once an element has been copied, paste options will be available when you right click on a Column again.

Paste After – You will get this right click option, when you copy an Element, Column or Container, and then right click on the same type of element again. This will paste the copied item after the item you have right clicked on.
Avada Builder Element Right Click Options
Edit – this will open the Settings of the specific element where you can customize it.

Clone – this will clone the specific element and place the cloned element directly after its original.

Save – this opens the Library window, where you can save the specific Element, as a normal or a global Element.

Remove – this will delete the specific Element from your layout. If you delete an element by mistake, you can use the History feature to undo it. For more information on this, view the History Feature document.

Copy – this will copy the specific element. Once an element has been copied, paste options will be available when you right click on an element again.

Paste After – You will get this right click option, when you copy an Element, Column or Container, and then right click on the same type of element again. This will paste the copied item after the item you have right clicked on.
Library Right Click OptionsThere are also right click options in the Avada Builder Library Edit Screens. The Library allows you to save and redeploy any elements, columns or containers, and even save pages as templates. Read more about the Avada Builder Library here.
If you are editing a saved library item, you will also have right click menus. If you right click on the same element type that it has been saved as, (e.g. right clicking on an element if the library type is for element) then it will only show Edit and Copy options. Other options such as Clone, Save, Remove, and Paste will be available if for example you right click on an element in a column or container library type.
IMPORTANT NOTE: You can copy an Element, Column, or Container from one page/post and then paste it into any other pages/posts as you require (or as many times). This includes adding Elements to widgets.