标签： options

Page Top & Bottom Padding

Each page you create with Avada will have default top and bottom padding applied. The page top padding starts directly below the header, and the page bottom padding directly above the footer area as illustrated below. Aside from the main header, there are also some elements on your page that may sit above the top padding, such as the Page Title Bar, and Sliders in some cases.
IMPORTANT NOTE: If your page does not have a Page Title Bar, the top padding will start directly under the main header.Page Padding OptionsFusion Theme OptionsYou can set a global top and bottom padding for the page content in Avada > Theme Options > Layout tab under the Layout section. This can be overridden on individual pages via the Fusion Page Options.
Fusion Page OptionsYou can choose to set the top and bottom padding for individual pages in the Page tab in the Fusion Page Options box. This will override the global option set in the Fusion Theme Options.
Pages With SlidersSliders Added Via Fusion Page OptionsIf you add a Fusion, Revolution or Layer slider using the Fusion Page Options, then the slider will sit above the top padding. This means that setting a Top Page Padding will not affect the slider.
Sliders Added Via Builder ElementsIf you add a Fusion, Revolution or Layer Slider using one of the slider elements in the Fusion Builder, then the slider will sit below the top padding. This means that setting a Top Page Padding will affect the slider.

Site Width Options

Avada includes various options that control the overall Site Width, Content and Sidebar Width. You can also choose between a boxed or wide layout for your pages. All these options are located under Appearance > Theme Options > Layout. To learn more about these various options, keep reading below.
Layout OptionsThe Global Options Layout section at Avada > Options > Layout, makes it easy for you to manage your site』s layout type, width, padding and sidebar layouts. Choose between Boxed and Wide layouts, set page content padding, 100% width pages』 left and right padding, and adjust the top and bottom margins for all column sizes and single and dual sidebar layouts.
Layout – Choose between Boxed or Wide for your site. These are global Theme Options and can be overridden by individual page Fusion Options on a page by page basis. The Boxed option will restrict your site』s width to the value set in the site width option, using any valid CSS unit for example: 1170px – In the boxed mode, it is possible to set a background image, background pattern or a background color for your site. The Wide option will display your site at the width set in the site width option, using any valid CSS unit for example: 1170px or 100% width of the browser window.
Site Width – This option allows you to set the overall site width in the boxed or wide layout. You can use a pixel value (px), or a percentage (%). If you』d like your site to span the full browser width enter 100% as a value. If you』d prefer a set size, you can enter something like 1170px. To further customize your site』s layout, we also have left and right padding options for the Header, Footer and Main Content Area found in Theme Options.
Boxed Mode Top/Bottom Offset – This option controls the top/bottom offset of the box in which the entire page is in boxed mode
Boxed Mode Offset Scroll Mode – Choose between Framed scrolling or Full scrolling. Framed scrolling will always make the top/bottom offset of the box visible when scrolling. Full scrolling will also scroll the offset along with the page
Boxed Mode Shadow Type – This option controls the type of the shadow the boxed mode will show.
Page Content Padding – These options control the top and bottom padding for all your page content. To learn more about this option, please read our 『Page Content Padding』 article.
100% Width Left/Right Padding – This option controls the left and right padding for page content when using 100% site width or 100% width page template. Enter value including any valid CSS unit, for example: 30px
Single and Dual Sidebar Layout OptionsHere you can control single and dual sidebar layouts for your site.
Single Sidebar Width – This option controls the width of a single sidebar on all pages. Enter value including any valid CSS unit, for example: 23% – Click here to see a demo example of a single sidebar layout.
Single Sidebar Gutter – This option Controls the space between the main content and a single sidebar.
Dual Sidebar Width 1 – This option controls the width of sidebar 1 when dual sidebars are present. Enter value including any valid CSS unit, for example: 21% – Click here to see a demo example of a dual sidebar layout.
Dual Sidebar Width 2 – This option controls the width of sidebar 2 when dual sidebars are present. Enter value including any valid CSS unit, for example: 21% – Click here to see a demo example of a dual sidebar layout.
Dual Sidebar Gutter – This option Controls the space between the main content and dual sidebars.

Parallax Scrolling Options

Parallax scrolling is when the background of the web page is moving at a different rate compared to the foreground, creating a 3D effect as you scroll. Directly below is an example of parallax behaviour, where we have a container with a background image and a parallax effect in place. As you can see when you scroll, the image moves up in the container.,Avada offers a range of options relating to Parallax scrolling for the different sctions of the page. There are settings for the header, the footer, the Page Title Bar, and container backgrounds. See below for links to each section.

Footer Parallax Options

Header Background Parallax Options

Page Title Bar Background Parallax Options

Container Background Parallax Options

Mobile Parallax Options

The 100% Width Page Template

Of all the page templates in Avada, the 100% Width page template is is the most flexible. Let』s just look at how this template works and what options there are with full width content.
This template might seem counter intuitive at first. If you add a Container with a full width Column, and then add some content inside the Column, like a Title or Text etc, you might be surprised to see that it is limited to the Site Width. But the template is designed with full flexibility in mind, so it』s possible to have just parts of your content going full width, or all of it if you prefer.
IMPORTANT NOTE: Sidebars are not supported on the 100% width template. If you require sidebars, then you can use the 『default』 template, or you can insert the Widget Area Element if you need to show a sidebar or widget section on the 100% width template.Container BackgroundThe key is the Container. If you add a color or background image to a Container when using this page template, the color or image will stretch full width. This is automatic with this template.
In the image below, you also can see the padding indicators. The Left/Right padding is global – coming from the 100% Width Padding setting on the Layout tab of the Fusion Theme Options. Note that the height of a Container is determined by either the internal content or padding. Here, there is no internal content as yet, and the Top/Bottom padding has been set to 80px on this specific Container.
Internal ContentThe internal content of the Container though is entirely up to you. By default, it stays limited to Site Width, as this is the default behavior for Containers, but there is an option in the Container Options for the Interior Content Width to be set to 100% Width. This will allow the interior content added to any Columns inside this Container to spread out to the edges of the browser, limited only by the 100% Width Padding value set in Theme Options > Layout, and/or any manual left/right padding you apply to the Column.
In the image below, the Interior Content Width has been set to 100% Width, and the Left/Right padding adjusted on this specific Container to 100px, while the Top/Bottom padding has been adjusted to 180px. See the Adjusting Margins & Padding in Avada Live doc for more info on how to do this.
SummaryThese two aspects of the 100% Width page template are all you need to control the Full Width Elements on your page.
By default, remember the Internal Content of Containers is limited to Site Width, even when using the 100% Width page template. What is automatic is that Containers that have background colors or images, display these at the full 100% width.
Internally, to get your content to go full width, all you need to do is enable the setting in the individual Container Options for the Interior Content Width to be 100% Width. Then you can fine tune your layout with your global or local padding options.
With this template, you can achieve a great 100% page layout, with full control over all elements.

Privacy Tool Options

What needs to be compliant is the end user website, it is not the software/framework a website is built on. The Avada WordPress theme as an entity does not violate GDPR criteria because it does not collect any data. What we as a team has done is give our Avada userbase existing and new, the tools necessary to ensure that their websites are GDPR compliant. These new privacy tools and options were introduced in Avada 5.5.2, released May 22nd, 2018.
OverviewPrivacy Theme OptionsGoogle Map Embed Overlay ExampleWordPress Privacy Page DesignationPrivacy Element Usage ExampleResourcesPrivacy Theme OptionsThe Privacy Elements options in the Avada Theme Options are located in Avada > Theme Options > Privacy section. These are global options options that will affect all your Privacy element instances unless otherwise specified within the individual element options.
Google Fonts Mode – Choose between Local or CDN. When set to Local, the Google fonts set in Theme Options will be downloaded to your server. When set to CDN, it will use the Google CDN.
Privacy Consent – Allows you to prevent embeds and scripts from loading until user consent is given.
Privacy Consent Cookie Expiration – Allows you to set how long the consent cookie should be stored in days.
Privacy Consent Types – Allows you to set the types of embeds you would like to require consent. Choose between Tracking Cookies, Google Maps, Twitter, Flickr, Facebook, SoundCloud, Vimeo, or YouTube.
Privacy Selected Consent Types – Allows you to set the types of embeds which you would like to be checked by default. This applies to both the privacy bar and the privacy element.
Privacy Placeholder Background Color – Allows you to set the background color for the privacy placeholders.
Privacy Placeholder Text Color – Allows you to set the text color for the embed placeholders.
Privacy Bar – Allows you to enable a privacy bar at the bottom of the page.
Privacy Bar Padding – Allows you to set the top/right/bottom/left paddings of the privacy bar area.
Privacy Bar Background Color – Allows you to set the background color for the privacy bar.
Privacy Bar Font Size – Allows you to set the font size for the privacy bar content.
Privacy Bar Text Color – Allows you to set the text color for the privacy bar content.
Privacy Bar Link Color – Allows you to set the link color for the privacy bar.
Privacy Bar Link Hover Color – Allows you to set the link hover color for the privacy bar.
Privacy Bar Text – Allows you to set the text which you want to appear on the privacy bar.
Privacy Bar Button Text – Allows you to set the button text for the privacy bar acceptance.
Privacy Bar Button Save On Click – If enabled, when the button is clicked it will save the default consent selection. If disabled, the button will only save the preferences after a checkbox has been changed (the bar will be hidden, however).
Privacy Bar Settings – If enabled, a settings section will be added to show more information and to provide checkboxes for tracking and third-party embeds.
Privacy Bar Settings Text – Allows you to set the link text for the privacy bar settings.
Privacy Bar Update Button Text – Allows you to set the button text for the privacy bar after a checkbox has changed.
Privacy Bar Heading Font Size – Allows you to set the font size for the privacy bar heading text.
Privacy Bar Headings Color – Allows you to set the text color of the privacy bar heading font.
Privacy Bar Content – This uses a repeater field to select the content for each column. Click the 「Add」 button to add additional columns. Choose between Custom, Tracking Cookies, or Third Party Embeds, and add a Title and Description for the content.
Google Map Embed Overlay ExampleAvada 5.5.2 gives you new Theme Options to prevent embeds from loading until user consent is granted to ensure GDP compliance. For any of the third party services, which you can freely choose from, you add to the consent list, the embeds will stop to be loaded on page load. Instead your users will see a placeholder graphic, with custom text on it and a button to accept this third party service. The background color and text color for that placeholder can be set in Theme Options.
Below is an example of the Google Map overlay on a contact form page, requiring consent:
In the above example you will see the following text:
Main Text – 「For privacy reasons Google Maps needs your permission to be loaded. For more details, please see our」 can be changed by editing the Avada .po file. See this help file on how to edit the language file.Page Link – 「Privacy Policy」 or whatever you choose to name that page is a link to a page on your site, detailing any privacy info for your customers. This page link is automatically enabled when you designate the page inside of the WordPress Privacy Settings panel. More info provided below.The WordPress 4.9.6 release comes with a series of Privacy Options for you to manage customer data and the option to designate a dedicated privacy policy page for your website. For the Avada embed overlay text to include this dedicated page, you need to enable this in the WordPress Dashboard >> Settings >> Privacy section
Privacy Element Usage ExampleThe whole setup is cookie driven and below is an example of what you will see on your site with a set of custom expiration dates for the cookies. Once it is expired your users will have to set their consents newly according to their preferences.
ResourcesPrivacy Element
Privacy Bar
GDPR and Avada Privacy Tools

The Avada Options Network

The Advanced Options Network is the backbone of Avada. These options give you full control over your website and allow you to customize your design without touching a single line of code. There are three major groups of options you can utilize within Avada: Avada Global Options, Avada Page Options and Avada Builder Element Options.
Watch the video, or keep reading below to find out more about Avada』s incredible options system.
Overview
Avada』s Option Network

How The Parts of  Avada』s Option Network Relate To Each Other
Advanced Option Network CorrelationAvada』s Option Network Dependencies,Avada』s Options NetworkThe Avada Website Builder comes with a well established, and highly flexible, advanced options network, that gives you maximum design freedom without the need to write any code. Continue reading below to learn about each part of the options network.

Avada Global Options – These can be accesssed from Avada > Options tab from the WordPress admin sidebar, and on the Sidebar, accessed from the Toggle Sidebar Icon, in Avada Live. These are the main options, and affect your entire site.

Avada Page Options – Located at the bottom of every page and post in the back-end Avada Builder, or in the Page Options Tab of the Sidebar in Avada Live. These are local options, that only apply to the page or post they』re set on.
Avada Builder Element Options – Located within each Avada Builder Element. These options will only affect the single element instance they』re set in.,Avada Global OptionsThe Avada Global Options are the heart of the Avada options network. They are presented in a well-organized panel, covering all areas of the theme. There are over 1,000 individual options in here. These are global options that affect your entire site. Please see the Avada Global Options document for full details of all the panels, and videos explaining many of the options.
Below is a screenshot of the back-end version of the Avada Global Options, as accessed from the WordPress dashboard at Avada > Options.
In Avada Live, you have access to the Avada Global Options panel without even leaving the page you are editing. Below is a screenshot of the Avada Global Options in the Avada Live, which is accessed from the Toggle Sidebar Icon found in the main Toolbar.,Avada Page OptionsThe Avada Page Options are local options, which only affect the page or post they are set on. These options override any corresponding global options set in the Avada Global Options. Below is a screenshot of the Avada Page Options, as found at the bottom of the page in the Avada Builder.
In Avada Live, the Avada Page Options are found in the Sidebar, along with the Avada Global Options. Below is a screenshot of the Avada Page Options, as found in Avada Live.,How The Parts of Avada』s Option Network Relate To Each OtherThere is a clear hierarchy for options set in Avada. Avada Global Options affect the entire site unless overridden. Avada Page Options and Avada Builder Element Options will use any values set in the Avada Global Options if left empty or if the value is set to default. However, if any other value is set, they will override the Avada Global Options.
This setup gives users maximum flexibility, with the option of setting a global option, then being able to override it on a per page/post/element basis.
Please see below for examples of how this override system works. The first example is a setting that is both present in Avada Global Options and in Avada Page Options, and the second, an example of an Avada Builder Element that has a corresponding Avada Global Option setting.,Global Options vs Page OptionsAvada Global OptionsBelow is a screenshot of the Page Background panel in the Avada Global Options. This is a scenario where a background image has been set, and the 『100% Background Image』 option is set to On, which means the background image will cover 100% width on all the pages throughout the site, unless otherwise specified in Page Options.
Avada Page OptionsBelow is a screenshot of the Background panel in the Avada Page Options. Here, a different image has been added for the Background Image For Page options, and the 100% Background Image option is set to No. So, on this page, a different background image will display, but it will not be at 100% width. Global options, local overrides.
767,650 Businesses Trust Avada
Get Avada767,650 Businesses Trust Avada
Get Avada767,650 Businesses Trust Avada
Get Avada,Element Global Options vs Element Local OptionsAvada Builder Element Global OptionsBelow is a screenshot of the 『Avada Builder Elements』 tab in the Avada Global Options. The 『Button Span』 option is set to No, and so all buttons on your website will be displayed as such, unless the corresponding button element option is overridden.
Avada Builder Element Local OptionsBelow is a screenshot of the Options Panel of a Button Element inserted into a page via the Avada Builder. In this instance of the Button Element, the Span has been set to Yes. This element option will override the corresponding option in the Avada Theme Options. You can also see the Default value in the description under the Option Title, as explained below in the Advanced Option Network Correlation section.,Advanced Option Network CorrelationIMPORTANT NOTE: This feature is only available in Avada version 5.0 or higher.When building your pages, we understand that it』s important to have a seamless experience. This is why we』ve implemented a new feature called Advanced Option Network Correlation. This feature allows you to view what default option you』ve set in the Avada Global Options for specific Avada Page and Element options. If you would like to change it, you can simply click on the link to be automatically redirected to that Global Option
In Avada Live, the Global Default values are seen by clicking on the Question Mark Icon to the right of each Option title. This toggles the option description. Any default values will be indicated in the descripiton, and you can click on them to be taken to the Global Option in question, just like you can in the back-end builder.
Learn More About Advanced Option Network Correlation,Option Network DependenciesIMPORTANT NOTE: This feature is only available in Avada version 5.0 or higher.Avada』s Option Network consists of the Avada Global Options, Avada Page Options, and the Avada Builder Element Options, and each of them have dependent options turned ON by default. This means the only options you see are the only ones currently available for your selection.
This is intended to keep options as streamlined as possible and to avoid visual clutter. The dependent options are hidden/visible according to your current site』s configuration. For example, if you have a side header active, then all options that aren』t relevant to side headers like top header options, will be hidden from view. This allows you to concentrate only on the options that will affect your current set up.
This feature can be disabled in Options > Advanced > Theme Features > Avada』s Option Network Dependencies. To learn more about Dependent Options, please see our article below.
Learn More About Dependent Options

Responsive Headings

Avada includes several Responsive Typography options. These are global options that can be set in the Avada > Options > Responsive section. Responsive Typography options have also been built into the Avada Slider. Continue reading below to learn more about each option and how to set them up.
Manage Responsive Options In Global OptionsLocated here -> Options > Responsive
Responsive Typography Sensitivity – Set to 0 to disable responsive typography. Increase the value for a greater effect.Minimum Font Size Factor – Determines the minimum font-size of elements affected by responsive typography using a multiplying value.Step 1 – Adjust the Responsive Typography Sensitivity by dragging the slider to fit your needs. 0 will disable responsive typography, and 1 is maximum responsiveness.
Step 2 – Adjust the Minimum Font Size Factor by dragging the slider left or right to control the multiplying value of the minimum font size. For example, if set to 0, then there is no minimum font-size. If set to 1 then the minimum font-size will be the same as the font-size of the element. If set to 2 then the minimum font-size will be double the initial font-size of the element.
Step 3 – Click the 『Save Changes』 to save your settings.
Manage Responsive Type For Avada SlidersAside from the Avada Global Options, you can also set the Responsive Type options in each Avada Slider.
IMPORTANT NOTE
The Avada Slider responsive typography settings are independent of the Global Option settings and only apply to the individual Avada Slider.Located here -> Avada Slider > Add/Edit Sliders
Step 1 – Select an existing slider or create a new one. At the bottom of the settings you will see the Responsive Typography Sensitivity options.
Step 2 – Enter the Responsive Typography Sensitivity and Mininum Font Size Factor settings to suit your needs.
Step 3 – Click the 『Update』 to save your settings.
Common Issues & Questions1. My headings are too big for mobile and are being cut offThis means that your responsive settings are probably not set correctly. Please check the Responsive Typography Sensitivity and Minimum Font Size Factor settings in the theme options and ensure the values are correct. Responsive Typography Sensitivity will increase the amount of resizing. 0 will disable responsive typography, while 1 is maximum responsiveness. Minimum Font Size Factor is used to determine the multiplying factor for the minimum font size.

The Avada Visibility System

In Avada, you will find an intuitive Visibility System for all Elements that you use on the page. This easy to use system allows you to choose when Elements are displayed, and when they are hidden, based on the screen size they are being viewed on.
For example, if you want a section of your page to only display on mobile devices and not on desktops, then our Visibility System lets you do that effortlessly. Continue reading below to learn more about the Avada Builder』s Visibility System.,OverviewContainer, Column and Element Visibility
How To Use The Visibility Options
Element Responsive Breakpoints
Element Sticky Visibility Options,Container, Column, and Element VisibilityThe 『Visibility』 option is available to use in all Elements, including Containers and Columns. This option is called 『Container Visibility』 for Containers, 『Column Visibility』 for Columns, and 『Element Visibility』 for all other Elements. By default, visibility is set on all three screen sizes, but you can enable or disable any number of screen sizes in the option. Continue reading below to learn more about how to use this option.
How To Use The Visibility OptionsStep 1 – On any Container, Column, or Element, locate the 『Element Visibility』 option and select which screens you』d like to display the element for. You can choose more than one option, or all of them.
Step 2 – Each of these options have a Custom Width Setting which you can set. To learn how, please refer to our 『Custom Width Settings』 section below.
Step 3 – Once finished, click 『Save』.
IMPORTANT NOTE – Container Visibility option will be disabled/hidden when using the 100% Height option for containers.767,650 Businesses Trust Avada
Get Avada767,650 Businesses Trust Avada
Get Avada767,650 Businesses Trust Avada
Get Avada,Element Responsive BreakpointsAll three size settings have an Element Responsive Breakpoint, which you can set in the Avada > Global Options > Responsive tab. This allows you to set the responsive breakpoint for the small, medium, and large screens and determine when your site will switch to a different screen visibility. For example, if you set 640 pixels for the Small Screen』s custom width settings, then when your site is viewed on a resolution that is equal or less to 640 pixels, any element with the 『Small Screen』 option enabled will display on your site.
How To Set Element Responsive BreakpointsStep 1 – Navigate to the Avada > Global Options > Responsive panel.
Step 2 – On this panel, locate the 『Element Responsive Breakpoints』 section.
Step 3 – Set the Small Screen』s custom width by entering a value in the text box, or by dragging the slider. When your site is viewed on a resolution that is less than or equal to the width set on this field, then the small screen visibility will take effect.
Step 4 – Set the Medium Screen』s custom width by entering a value in the text box, or by dragging the slider. When your site is viewed on a resolution that is less than or equal to the width set on this field, then the medium screen visibility will take effect.
Step 5 – The Large Screen』s custom width is automatically filled in depending on what width you』ve entered for the Medium Screen option. When your site is viewed on a resolution that is greater than the Medium Screen width, then the large screen visibility will take effect.
Step 6 – Once finished, click 『Save Changes』.,Element Sticky Visibility OptionAs of Avada 7.0, you will also find the Element Sticky Visibility option in some Elements. This is a dependent option which only appears if the parent Container is set to Sticky. It allows you to determine when the Element will be visible, based on whether the Container it is in, is in Sticky mode or not. You can choose from Normal and Sticky visibility, and by default, they are both selected, meaning the Element is always visible. But if you deselect the Normal option, the Element will ONLY be visible when the parent Container is in Sticky mode.
This can be used in a number of creative ways, particularly with Header Layouts, but generally as well. The Column Element has this option as well, and in the above example with an individual Sticky Container, you would set the Column Element Visibility to only sticky, so the entire Column would only display when the parent Container went into Sticky mode.
An example of this technique can be seen in New Header 5, one of the Prebuilt Headers for Layouts. In this Layout, as you can see below, there are two Containers, with the second one being set to Sticky. The two outside Columns on the second Container have their Element Visibility set to Sticky only, and so in the normal state of the Container, these two Columns, and the Elements inside them, are not visible, but when the Sticky Container activates, the logo and the Woo Menu suddenly appear in the Container.
Currently, this option is only available for the Columns, Nested Columns, Alert, Breadcrumbs, Button, Icon, Image, Menu, Search, Separator, Sharing Box, Social Links, Title, and Text Block Elements.
Normal Container
Container in Sticky Mode

Responsive Option Sets

This awesome new feature, introduced in Avada 7.0, allows you to set certain options independently for different screen sizes. This is achieved by allowing some specific Element options to hold up to three sets of values, corresponding with the three Responsive screen sizes, Large (Desktop), Medium (Tablet) and Small (Phone). Read on to learn how to use it, or watch the video below, for a visual overview.
WHAT IS RESPONSIVE?: Responsive design is when the content on the page automatically adjusts for different screen and viewport sizes. This could be a laptop, a tablet, a mobile phone, or even just a desktop computer with the screen resized.,Overview
Isn』t Avada Already Responsive?
Where To Find ItHow To Use ItGlobal Options,Where To Find ItResponsive Options Sets are available on selected options in the Container and Column Elements, as well as a few other selected Design Elements; at this point the Button, Image, Text Block, and Title Elements. This is a brand new feature, and it will expand over time to other Elements and options.
 
There are very clear indicators for when Responsive Option Sets are available. In the back end editor interface, you will see the word 『Responsive』 and a set of icons in the Title Bar of any Element that uses it. As well, a screen icon will be visible next to the options available for use with the feature, as seen below.
In Avada Live, on the right hand side of the toolbar, you will find the Responsive Icon. This is no longer just a preview option to see how the site looks on different screen sizes, but is also a new responsive editing mode. When you select a specific screen size, like Medium or Small, not only does the layout change on the screen, but any Responsive Options that you set while in that view, will apply only for that view.
You can also adjust the Responsive Screen view in Avada Live from the actual Element options that support it, by clicking on the icon in the option.,How To Use ItAs you can see in the example of the Live Builder below, I have chosen the Small (Phone) Responsive Icon in the toolbar, and in the Padding Option for the Container I am editing, the icon has changed to the same icon, signifying that the values inserted (in this case 10px padding on the left and right sides of the Container) will only apply when the screen is at Small size.
Any responsive option set while in the Desktop view will carry through to both medium and small layouts, but if you want a specific value, for either Tablet or Phone for example, you would just click on the respective icon and then enter a different value into the relevant option.
It works the same way in the back end interface of the builder, but it just looks a little different. If we look at the Container or Column Element in the back-end interface of Avada Builder, we can see three Responsive icons at the top of the Element. If we select a specific icon along the top, the options included in this feature and that also have a responsive icon, will change their icons to match the one selected at the top. This shows that the values you set in this options will apply only to the selected layout.
See the image below to see how this works. Note how in the image, the Mobile Responsive view has been selected in the Container header, and in the Margin and Padding options of the Container, the Responsive Icons there have changed to a phone, showing that the values entered there will only apply when the page is viewed at Mobile size.
There are many options and situations you can change with this system to help you fine tune your design on Tablets and Mobile, including How To Set The Display Order And Size Of Columns In Responsive Layouts, and Alignment options on several Elements, including the Button, Image, Text Block, and Title Elements.,Global OptionsIt』s also important to realize you have full control over the responsive sizes and behaviors in Avada. For example, under the Responsive Options, found at Avada > Options > Responsive > Element Responsive Breakpoints, you can determine the breakpoints at which a Medium Screen and a Small Screen kick in.
IMPORTANT NOTE: Note, this feature will not work on Legacy Containers and Columns.And under the Global Column options, found at Avada > Global Options > Avada Builder Elements > Columns, you can control the default behavior for Columns in responsive situations.
By default, Medium size screens inherit the layout from Desktop, and Small size screens revert to full width Columns, but you can, of course, change these default behaviors as you wish.
This new feature is a real game changer. With Responsive Option Sets, you now have full control over your responsive layouts, all within the same containers and columns.
Check Out How To Set The Display Order And Size Of Columns In Responsive Layouts

toTop Button

The toTop Button has been around a while in Avada, unobtrusively assisting you back to the top of the page when required. But with Avada 5.9, we have added some enhancements to the script, to make this feature even more useful to you.
Enable/Disable toTopThe toTop Button can be enabled/ disabled at Fusion Theme Options > Advanced > Theme Features. It can be enabled/disabled separately for desktop and mobile, or for both.
toTop SettingsThe new configuration options for the toTop Button can be found at Extra > Miscellaneous.

ToTop Button Position – You can now choose the position of the toTop button. Choose from Left, Left Floating, Right, or Right Floating. The Floating options lift the button off the base of the viewport to leave the button floating on the page.

ToTop Border Radius – You can now control the border radius of the ToTop button. For non-floating layouts, the border radius will only apply to the upper corners. In pixels. 0px would create an entirely square button, while 50px would create a circular button.

ToTop Show on Scroll Down Only – You can now also choose to show the ToTop button on scroll down only. Otherwise it will always show if the page is scrolled.