Sidebars

02/12/2018

Sidebars are vertical columns for displaying information other than the main content of the web page. Avada offers both single and dual sidebars. Sidebars can be assigned globally (same sidebars sitewide) or individually (different sidebars per page or post). Avada includes a powerful set of options to achieve this throughout the theme. Please read below to understand where sidebars can be used and how to assign them globally or individually.

IMPORTANT NOTE: Sidebars are containers that accept widget sections. You must first create a widget section and assign widgets to it before you can assign it to a sidebar. To learn how to create widget sections and assign widgets, please refer to our Widget posts.

Overview

Global Sidebars vs Individual Page Sidebars

Global Sidebars - Global sidebars will override the individual sidebar options set in the Fusion Page Options. You can enable global sidebars for each different sections of your site such as pages, portfolio posts, blog posts, and the search results page. Use this when you want every page to show the exact same sidebar. Global sidebar options can be found in the Avada > Theme Options > Sidebars panel.

Individual Sidebars - If global sidebars are disabled, then you can use individual sidebars when you want a unique sidebar or no sidebars on a page or post. If "Activate Global Sidebar" option is enabled, it will override the Page Options (sidebar options in the Page Options will be disabled), and will force the sidebars set in Theme Options to be used everywhere for that corresponding post type. Individual sidebars can be assigned in the Fusion Page Options of each page or post.

Note: Should you need to set a different sidebar for specific pages/posts at some point, then, recommended setup would be to set global sidebars in Theme Options, and have the "Activate Global Sidebar" option set to Off. For all pages/posts that should use the sidebars set in Theme Options, make sure the sidebars are set to "Default" in Page Options. For the pages/posts you want an individual override, set the sidebars to what you prefer in Page Options.

Global Sidebar Areas

There are 10 sections of your site where you can enable global sidebars. Some of these areas require the respective plugins to be installed and activated. Continue reading below to learn about each section.

IMPORTANT NOTE: The WooCommerce Product and Archive / Category Pages, Events Calendar, and bbPress/BuddyPress options will appear only if the WooCommerce, The Events Calendar, and the bbPress plugins are installed and activated, respectively.
    • Pages - All page templates except for the '100% Width' page template.
    • Portfolio Posts - Single post pages that are created for all portfolio posts.
    • Portfolio Archive / Category Pages - All archive/category pages created for portfolio posts.
    • Blog Posts - Single post pages that are created for all blog posts.
    • Blog Archive / Category Pages - All archive/category pages created for blog posts.
    • Search Page - The search results page that displays when a search is performed.
    • WooCommerce Products - Single post pages that are created for all WooCommerce products.
    • WooCommerce Archive / Category Pages - All archive/category pages created for WooCommerce products.
    • Events Calendar - All single post pages created for Events Calendar.
    • bbPress/BuddyPress - Any forum/topic post that is created using the bbPress plugin.
    Theme Options Sidebars Tab

    Before applying a global sidebar for a section of your site, you must first create a widget section, assign widgets to it, then you can assign it to the sidebar you'd like to use as a global sidebar. To learn how to create widget sections, please refer to our Creating Widget Sections article.

    Step 1 - Navigate to the Avada > Theme Options > Sidebars panel. Select the sub-panel for the area you're wanting to assign a global sidebar to. For example, if you want to assign a global sidebar to all of your page templates, then go to the Theme Options > Sidebars > Pages sub-panel.

    Step 2 - Enable global sidebars by setting the 'Activate Global Sidebar' option to On. Note: If "Activate Global Sidebar" option is set to On, the Sidebars option will be disabled in the Fusion Page Options of the corresponding page or post.

    IMPORTANT NOTE: Category and Archive pages do not have this option because they do not have individual page options like other pages.

    Step 3 - Select the name of the widget section you'd like to display for Sidebar 1 and Sidebar 2. If you only want one sidebar, then set the 'Sidebar 2' option to None.

    Step 4 - You can also select a position for Sidebar 1. If you're also using Sidebar 2, it will automatically be placed on the opposite side of Sidebar 1.

    Step 5 - Once finished, press the 'Save Changes' button.

    Theme Options > Sidebars > Pages

    How To Apply Individual Sidebars Using Fusion Page Options

    If you don't want to use global sidebars and would rather assign a specific sidebar for specific pages or posts, then you can do so using our Fusion Page Options which is located in every page or post you create.

    IMPORTANT NOTE: Sidebars options in Fusion Page Options will be hidden if the 'Activate Global Sidebars' option is set to ON, so you must deactivate it for your individual sidebars to appear. For example, if you'd like to assign individual sidebars for specific pages, then the 'Activate Global Sidebars' option under the Theme Options > Sidebars > Pages panel must be set to Off.

    Step 1 - Create a new page or post or edit an existing one.

    Step 2 - Scroll below the main content field and find the Fusion Page Options box. In this section, you'll find the Sidebars tab.

    Step 3 - Select the name of the widget section you'd like to display for Sidebar 1 and Sidebar 2. If you only want one sidebar, then set the 'Sidebar 2' option to No Sidebar.

    Step 4 - Select a position for Sidebar 1. If you're also using Sidebar 2, it will automatically be placed on the opposite side of Sidebar 1.

    Step 5 - You can also choose a background color for the sidebar. Simply use the color picker interface or enter the hexcode of the color you'd like to display in the 'Sidebar Background Color' option. For example, #000000.

    Step 5 - Once finished, click the 'Save Draft' or 'Publish' button to save your changes.

    Fusion Page Options Pages Sidebars Tab

    Single, Dual or No Sidebars

    Avada allows for single, dual, or no sidebars. There are two sidebar dropdown fields that allow you to make these selections; Sidebar 1 and Sidebar 2. You can also set the position for Sidebar 1, and Sidebar 2 will automatically be set to the opposite side. Continue reading below for more information.

      • Single Sidebar - To achieve a single sidebar, assign a widget section to the 'Sidebar 1' option, then set the 'Sidebar 2' option to No Sidebar.
      • Dual Sidebars - To achieve dual sidebars, assign a widget section to both 'Sidebar 1' and 'Sidebar 2' options.
      • No Sidebars - To disable sidebars, select No Sidebar for both 'Sidebar 1' and 'Sidebar 2' options. The page will be full width.
      IMPORTANT NOTE: The 'Side Navigation' page template can have dual sidebars. Sidebar 1 will be placed underneath the side navigation set, Sidebar 2 will be placed on the opposite side.

      Sidebar Position

      Avada offers a sidebar position option for Sidebar 1, this can be chosen globally in Fusion Theme Options or individually per page or post. The Fusion Page Option overrides the Fusion Theme Option. Note, when set to Default the Fusion Page Option is pulling from the Fusion Theme Option.

      IMPORTANT NOTE: The sidebar position option only works with Sidebar 1. If using dual sidebars, Sidebar 2 will be placed on the opposite side of Sidebar 1. For the Side Navigation page template, the sidebar position option will affect the side navigation side, and Sidebar 2 will be placed on the opposite side.

      As of Avada 5.2, you have the option to enable sticky sidebars on your Avada site. When Sticky Sidebar is enabled, the sidebar will scroll with the content as the viewer moves down the page. For more information on using sticky sidebars, please see our post here.

      Sticky Sidebars Option

      Recent Posts

      Recent Tweets

      For privacy reasons Twitter needs your permission to be loaded. For more details, please see our Privacy Policy.
      I Accept