Avada 文档

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.

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.

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.

Cloning, Copying & Moving Elements in Avada Live

To make it easier for you to copy and move your page content around in Avada Live, you will find a range of clone, copy and move functions.
Read on to find out more about how to work with content in Avada Live, or watch the video for a visual overview.,CloningIn Avada Builder, you can easily clone any of your page content. Cloning an object is making a duplicate copy of it. Whether it is a Container, a Column, or an Element, the cloned object is then placed immediately after the original object. This is the main difference between cloning and copying. With copying, the object is held in memory on the clipboard, but with cloning, it is simply duplicated and inserted.
There are two ways to clone objects in Avada Builder. The first one is to use our right-click functionality. This is available in both the Back-End and Front-End Builders, and allows you to select from a range of options. Simply right-click over your desired Container, Column, or Element and right-click. This brings up a contextual menu, and Clone is one of the options available.
With Parent and Child items, it should be noted you can clone either the child or the parent (which includes all the children). In the example below, I have right clicked over the Parent Counter Boxes, and so I would be cloning the entire row of Counter Boxes.
The second way to clone an object is to choose Clone from the Container, Column or Element Controls. When you hover over an Element Control, you will see a range of icons. One of these is the clone icon. Simply click that icon, and the object will again be cloned and inserted immediately after the object cloned.
767,650 Businesses Trust Avada
Get Avada767,650 Businesses Trust Avada
Get Avada767,650 Businesses Trust Avada
Get Avada,CopyingCopying an object is to copy the underlying code and hold it in memory on the clipboard. Copying is only accessible from the Right-Click function in Avada Live. It is similar to Cloning, but different as well.
When you copy a Container, Column, or Element, you are essentially copying the code to the clipboard. If you then right-click on a different part of the page, you can then paste the copied object into a new part of the page. It』s the equivalent of cloning an object and then dragging it to a new place on the page.
When you copy an Element you can also paste this into text-based areas as well, such as a Widget or Slider input field, etc.,MovingYou can also just move an object in Avada Builder. Any time you see the clenched hand icon, you can drag the object you are hovering over, and grey guidelines will appear showing you where you can drag it to. When you drag it to a place where it can successfully be moved, the line turns blue and you can let go.
What you need to be aware of is that you can』t drag a container into a column or element position, so not every place you try to move objects to will work. Consider what you are trying to move carefully and you will have much more success.
You can also hover over the live controls of any specific element and choose the Move option. This is sometimes more useful for selecting specific elements in amongst many others.
In the example below, I am moving an entire column up above the column above. You can see the line to the left of the top column has turned blue, which lets me know I can place the column there. Because they are both full-width columns, the moved column will be placed above the other column.

Best Practices for Inline Editing in Avada Live

One of the great new features in Avada Live is the ability to edit text directly on the page. Not only can you edit text, but you can also apply a range of inline editing options, including font color, and size. But several of these options also exist in the element options, so it』s good to know what the best practices are for working with inline editing. Watch the video or read on to find out…,OverviewInline Editing & Formatting
Editing Elements As A Whole
Editing Part Of An ElementInline Options,Inline Editing & FormattingInline editing is available with any text-based elements in Avada Live. That will be the Title Element and the Text Block primarily, but also any element that has editable text components, like the Button, Alert, Checklist, Content Boxes, Countdown and Progress Bar Elements to name a few.
Inline editing can be seen in two ways. The first is simply changing the content directly on the page. In Avada Live, you can simply click in the text content, and start typing to add or edit existing text.
The second type of inline editing is inline formatting. When we make a selection in our text, the Inline Editor appears, and here we can make a variety of typography changes to our selection.
The guiding principle when it comes to inline editing is that if you want to change the content in its entirety – change the font color, or size, etc – then it』s best to look in the element options for this – but if you just want to change a single word to bold or a different color etc, then inline editing is perfect for that.
767,637 Businesses Trust Avada
Get Avada767,637 Businesses Trust Avada
Get Avada767,637 Businesses Trust Avada
Get Avada,Editing Elements As A WholeTo start with, let』s look at an example of what we can do with the Title Element.
In the design tab of the Title Element, let』s look at the changes we can make to the Element as a whole. Here, we can change the alignment of the title, and set the Heading Size, which itself, has a range of default options set in the individual Header tags in the theme options.
If we wish, we can also override any of these global element options for this single instance of the element, including the font size, the line height, letter spacing, margins, font color and separator style, and color. All the changes made here apply to the title as a whole.,Editing Part of An ElementWhereas if we wanted to just change one word, or a section of the Title Element, we can select the desired text, and the Inline Editor appears. There are a variety of typography options that you can change with inline formatting. In this example below, I have edited the actual word, and then made it bold and changed its color.
If you look at the element in text view, you can then see the inline HTML that has been applied to the element.,Inline OptionsLet』s have a quick systematic look at the inline options.
The first one is typography, where we can change the font size, line height, letter and spacing, as well as the font tag and even the font family and variant. Next is the font color. Then there are a few typical formatting options like Bold, Italic and Underlined. Next, you can quickly add a link to any selected text, and next to that are alignment options. This option will affect the entire paragraph, even if you have just one word selected.
Next to this is the icon for the Extended Options. These are Strikethrough.. Blockquote (again, this will affect the entire paragraph), as will the next four options – unordered and ordered lists and indent and outdent. The next option will remove formatting already applied, and the penultimate one closes the extended options.
The very last option allows you access to the Inline Elements, like Dropcap, Highlight, and Popover. These are special elements that only work in conjunction with text or other content, and not directly on their own. Please read the Inline Elements Doc for more information on these elements.
Another important thing to note is that inline edit options override element options. If you follow best practices, this won』t be an issue.
Avada also has a great new feature, that if it detects you are making an inline edit on an entire element, it will transfer that change to the element options, instead of leaving it as inline HTML. Now that』s smart!

Avada Live Local Options Management

For a long time in Avada, we have had local options management via the Page Options panel, found at the bottom of every page when editing. With Avada Live, we also have Local Options Management directly on the page. So while you are editing a page in Avada Live, you can also access the Page Options panel as you can in the back-end editor, but here, it is found in the Sidebar panel, which, by default, loads at the left-hand side of the page.
Watch the video, or read on to find out more about this new way of working with Local Options.,How To Access Local Options in Avada LiveThere are several types of Local Options you can access and manage in Avada Live.
The first ones are, of course, the Page Options. On the Toolbar, at the top of the page, you will see a row of icons, as shown in the image below. The second one along is the Sidebar Icon, and clicking on this opens the Sidebar. The Page Options are available from the second icon on the Sidebar, also as shown below.
767,645 Businesses Trust Avada
Get Avada767,645 Businesses Trust Avada
Get Avada767,645 Businesses Trust Avada
Get Avada,Page OptionsThe entire set of Page Options are available to you here, in an easy to use interface. Any changes you make in the Page Options are shown directly on the page as it auto-refreshes to show you the changes.
NB. Two notable changes from the back-end builder are the addition of a Settings tab, which is where you can change the Page Title, Slug, Parent, Page Template, and add featured images to a page, and a Custom CSS tab, which is where you can add local custom CSS for the open page or post.
With any changes you make on the Sidebar, you will notice the Save Icon on the Toolbar becomes blue. This signifies changes have been made and are ready to save.,Other Local OptionsSome local page features are not editable directly in the Front-End Builder, in the same way, they are not editable from the back-end builder. These areas are not in the page content, and are controlled from the Page Options, or other areas in WordPress. These are areas like Sliders, and the Page Title Bar.
Sliders and the Page Title Bar are initially added from the Header Icon Controls, as shown above, but if they are already assigned to the page, then you will instead find both Global and Local Edit Icons, as well as a Remove icon, on the actual Slider or Page Title Bar, as seen below.,Global Save ButtonAs noted above, there is no Save button at the bottom of the Page Options panel in Avada Live. All changes are updated on the page as soon as they are made, but with Avada Live we have combined the Save button for both page content, and theme and page options.
So now there is one Global Save button, on the far right of the top toolbar. When no changes have been made, the icon is grey. It turns blue as soon as any change has been made, whether that is in page content, or global or page options, and when you click it, the button turns temporarily green to show you it has saved before turning grey again. History states are also cleared when a page is saved.
See the Avada Live Global Options Management Doc Here!

Avada Live Global Options Management

With Avada Live, Global Options Management is built directly into the Builder.
What this means, is that while you are editing a page in Avada Live, you can also access the Global Options Panel without leaving the page, make any changes you wish, and have the changes reflect immediately in the document you are working on. This is a great time saving workflow feature and will speed up your work considerably.
Please watch the video, or read on below to find out more about this great new feature.,How To Access Global Options In Avada LiveThere are several types of global options you can access and manage in Avada Live.
The first ones are the Avada Global Options. On the Toolbar, at the top of the page, you will see a row of icons, as shown in the image below. The second one along is the Sidebar icon. Clicking this opens the Sidebar, which has three tabs – the Global Options, the Page Options, and Element Options panel.
767,645 Businesses Trust Avada
Get Avada767,645 Businesses Trust Avada
Get Avada767,645 Businesses Trust Avada
Get Avada,Avada Global OptionsThe Sidebar opens, by default, in a panel on the left of the screen, as seen below. If you prefer, you can set it on the right, via the Preferences icon on the toolbar. The entire set of the Global Options are available to you here in the Sidebar, in an easy to use interface.
Any changes you make in the Global Options are shown directly on the page as it auto-refreshes to show you the changes. Also, after any changes, you will notice the Save Button at the top-right of the Toolbar becomes blue. This signifies changes have been made and are ready to save.,Avada Builder Element OptionsAs part of the Avada Options, there are, of course, the Avada Builder Element Options. This is the penultimate item of the Global Options panel, and is where you can set global options for the Avada Builder Elements.
Like the other global options, any relevant changes you make will be updated instantly on the page, and the Save button will go blue to show there are unsaved changes.,Other Global OptionsSome sections of the page are not editable directly in Avada Live, in the same way, they are not editable in the back-end builder. These areas are not coming from the builder, and are controlled from the Global Options, or other areas in WordPress.
These are areas like the Header, the Menu, the Logo, the Sliders, the Page Title Bar, the Sidebars, the Sliding Bar, and the Footer. You can identify these areas most easily by toggling the Wireframe icon on the top Toolbar. The sections that are not in the Wireframe are outside of page content.
In Avada Live, if you mouse over one of these areas, you will see a Control Bar with icons, and clicking the various icons takes you directly to the relevant section of WordPress, in a new tab, or the Global Options, in the Sidebar Panel. Depending on the icon, and what the default settings are, these may be global or local options. In the Header Control Bar, for example, there is a shortcut to the Header Layout, the Logo, and the Main Menu (all global), as well as an Add Slider Icon if there is no slider on the page (local option), and an Add Page Title Bar Icon (again, only if there is no Page Title Bar already on the page and this Icon is local or global depending on default settings).
If your site has a Custom Header Layout, then instead, 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.,Global Save ButtonAs noted above, there is no Save button at the bottom of the Global Options panel in Avada Live. All changes are updated on the page as soon as they are made, but with Avada Live, we have combined the Save button for both page content, and theme and page options.
So now there is a Global Save Button, on the far right of the top toolbar. When no changes have been made, the icon is grey. It turns blue as soon as any change has been made, whether that is in page content, theme options, or page options, and when you click it, the button turns temporarily green to show you it has saved before turning grey again. History states are also cleared when a page is saved.
See the Avada Live Local Options Management Doc Here!

Avada Live Builder Preferences

Avada Live has an intuitive and minimalist workspace, but there are also a range of preferences to help you work in the way you want to. Let』s look at the Preferences, accessed from the main toolbar from the Preferences icon, as seen below.
Read on to discover how you can customize your Workspace with the Avada Live Preferences, and watch the video below for a visual overview.,The PreferencesSidebar Panel PositionElement Editing ModeAutomatically Open Element SettingsEnable Keyboard ShortcutsShow Option Descriptions By DefaultShow Tooltips
Enable Sticky Header & Containers
Enable Transparent Header & Absolute Containers
Enable Preview for Filter OptionsShow Droppable Areas While DraggingSidebar Panel Overlay ModeKeyboard Shortcuts,Sidebar Panel PositionSelect the side which you want the sidebar panel to be displayed on. If you use the Sidebar Element Editing Mode, you can determine whether the panel opens on the left or the right side of the screen. Left is the default.,Element Editing ModeChoose if element editing should be in the sidebar or in a dialog. If you choose dialog, you can resize and move the dialog to whatever position on the screen you prefer.,Automatically Open Element SettingsChoose if the settings should be opened automatically after adding an element. By default, this is turned on. In most cases, the default behavior will be ideal, as when adding an Element, you will usually want to edit it immediately.,Enable Keyboard ShortcutsChoose if Keyboard Shortcuts should be enabled or disabled. There are a range of Keyboard Shortcuts in Avada Live, and you can enable or disable them here. See the Keyboard Shortcuts section below for more detail.,Show Option Descriptions By DefaultChoose if option descriptions should be shown or hidden by default. You can always toggle the description on any of the individual options, but if you prefer to always see the option descriptions, you can set this option to Show.,Show TooltipsChoose if tooltips should be enabled or disabled. This controls the description you get when you hover over any tool in Avada Live. It is on by default.,Enable Sticky Header & ContainersChoose if sticky header and containers should be enabled or disabled. Sticky Headers and Containers can obstruct Container Controls while building. This option just disables the sticky header and containers in the Live Builder, not on the front end.
767,669 Businesses Trust Avada
Get Avada767,669 Businesses Trust Avada
Get Avada767,669 Businesses Trust Avada
Get Avada,Enable Transparent Header & Absolute ContainersChoose if transparent header and absolute containers should be enabled or disabled. Transparent headers can block Container Controls at times, so if your site has a transparent header, or an absolute container, you can enable or disable it in the Live Builder here.,Enable Preview for Filter OptionsChoose if Element filter options preview should be enabled or disabled. Some Elements have a range of Filters, under the Extras tab. This setting determines whether you see a preview of these filters while editing.,Show Droppable Areas While DraggingEnable in order to see all droppable areas while dragging element. With this enabled, you will see all possible droppable areas as a white line. With it disabled, you will only see a blue line as you mouse over a droppable area.,Sidebar Panel Overlay ModeChoose if the sidebar panel should act as an overlay. If enabled, the sidebar will overlay the preview content. If disabled, the preview content will resize to fit the new screen area.,Keyboard ShortcutsAvada Live also comes with a range of shortcuts to help with your efficiency. You can find a full list of these under the Support Icon on the right hand side of the toolbar as seen below.
There are a range of both Toggle Hotkeys, and Action Hotkeys. See the full list below.