Widgets

Widgets are bundled with WooCommerce that allow you to display products, reviews and the cart in your theme’s widget areas, including sidebars, footers, headers and the homepage.

Shop Sidebar

How to enable the shop sidebar?

The Shop Sidebar is an actual WordPress widgets area and it should show up as soon as it’s populated with at least one widget. Navigate to Appearance > Widgets and populate the Shop Sidebar widget area with a few widgets using drag-and-drop.

The shop page has 2 sidebar areas :

1. Products Filter sidebar widget area : In here we place all filter widgets. This widget area is purely for the purpose of styling. So all widgets that needed to be styled like filters should be placed here.

2. Shop Sidebar widget area : This sidebar area should contain all other widgets. By default the Products Filter sidebar widget area ( mentioned above ) is not displayed. There is a widget called “Electro Product Filter” which represents the Products Filter sidebar widget area. You should place all your filter widgets like “WooCommerce Layered Nav”, “WooCommerce Price Filter” in “Product Filters” widget area only. Once you have placed all the filters in the product filters widget, you can then add “Electro Product Filter” widget in ”Shop Sidebar” widget area.

Shop Sidebar Widgets

  1. Electro Product Categories Widget : Widget for Product Categories
  2. Electro Product Filter Widget : To filter products.
  3. Text Widget : Text widget for Banner Image.
  4. WooCommerce Products Widget : Widget for Latest Products.

Product Filters Sidebar

  1. WooCommerce Layered Nav Widget : Active Filters.
  2. WooCommerce Layered Nav Widget : To filter products by Brands.
  3. WooCommerce Layered Nav Widget : To filter products by Colors.
  4. WooCommerce Price Filter Widget : To filter products by price.

Output of Shop Sidebar Widget

Homepage Sidebar

  1. To enable sidebar in Homepage choose Homepage V2 Template under Page Attributes.
  2. Click on Publish.
  3. After publish, Home v2 will appear with right sidebar layout.

HomePage Widgets

To configure sidebar for Home v2, navigate to Appearance > Widgets > Home Sidebar here drag and drop the following widgets

  1. Text Widget : Text widget for Banner Image.
  2. WooCommerce Products Widget : Widget for Latest Products.
  3. Electro Features Block Widget : Widget to display Feature List.
  4. Electro Products Carousel Widget : Widget for Product Carousel.
  5. Electro Post Carousel Widget : Widget for Post Carousel.

Output of HomePage Widgets

Blog Sidebar

Navigate to Electro > Blog > Blog Page Layout here choose Right Sidebar or Left Sidebar to enable sidebar in Blog Page.

How to add widgets to Blog sidebar?

You have a a list of Widgets you can choose from when it comes to making the sidebar functional, for this go to Appearance > Widgets. Choose the ones you need and add them to the Sidebar:

Blog Sidebar Widgets

  • Search Widget – The Search widget adds a search box to your blog sidebar, allowing readers to easily search your site for posts and pages you’ve written in the past.
  • Text Widget – Text widget about Blog.
  • Categories Widget – The Categories Widget organizes your posts by category in your blog’s sidebar.
  • Electro Recent Posts Widget – Widget for recent post.
  • Tag Cloud Widget – The Tag Cloud widget shows a list of all the tags you’ve assigned to your posts.

Output of Blog Sidebar Widgets

Footer Widgets

In Footer Electro has two Widget areas. They are Footer Widgets and Footer Bottom Widgets.

Footer Widgets

Footer Widgets is a widgetized area and can be populated with 3 widgets and are loaded by default when there are no widgets. To change it you can add your own widgets in Appearance > Widgets > Footer Widgets.

You can also disable the footer widgets section in Electro > Footer > Show Footer Widgets to “Off”.On the left hand side are your widgets, simply drag and drop the widgets you want from the left side into the ‘Footer Widget’ sections on the right side.

By default the footer widget area is populated with 3 instances of 3 widgets and they are :

  1. WooCommerce Products Widget – configured to display Featured Products
  2. WooCommerce Products Widget – configured to display On Sale Products
  3. WooCommerce Top Selling Products Widget.

Output of Footer Widgets

Footer Bottom Widget Area

It is a widgetized area and it can contain any number of widgets. It can be populated from Appearance > Widgets > Footer Bottom Widget Area.

By default the footer bottom widget area is populated with 3 instances of 3 widgets and they are :

  1. WooCommerce Categories Widgets – configured to display Find It Fast section
  2. WP Meta Widget – configured to display Meta Information links.
  3. WP Pages Widget – configured to display Pages menu links.

Output of Footer Bottom Widget