Porto Filter Toggle Element

The Filter Toggle element in the Porto theme is a simple yet powerful tool used in product archive pages built with WPBakery Page Builder or Elementor. This widget does not contain any internal configuration options. Its sole purpose is to control the visibility of product filters on the shop/archive page depending on the selected Filter Layout.

When added to the archive layout, the Filter Toggle works together with Porto's filter system to show or hide the filter area (sidebar or horizontal filter section). This behavior depends heavily on the chosen Filter Layout under Porto → Theme Options → WooCommerce → Product Archives → Filter Layout

For full details on how filter layouts interact with the Filter Toggle widget, please refer to the Filter Layout Settings documentation.

• Edit your Product Archive Block
  Go to Porto → Template Builder → Product Archive and open your archive layout using WPBakery or Elementor.

• Add the Filter Toggle Widget

  • In WPBakery, you can add this widget inside the Porto Tool Box element.
  • In Elementor, you can place it directly inside any container.
• Save the Layout and view the behavior on the frontend.
  The widget may display differently in the page builder preview, so always verify on the actual shop page.

The Filter Toggle element behaves differently depending on the active filter layout.

1. Sidebar (Default Layout)
   • Filter Toggle does nothing in this layout.
   • The sidebar is always visible normally. You typically do not need this widget for Default Sidebar layout.
2. Sidebar With Toggle
   • The Filter Toggle controls the show/hide behavior of the sidebar.
   • When clicked, it collapses or expands the Shop Sidebar widget area.
   • This is the layout where the Filter Toggle is most commonly required.
3. Off-Canvas Filters
   • The Filter Toggle opens the sidebar as an off-canvas panel.

   • If the “Show as Off-Canvas Sidebar on Mobile” option is enabled in Porto → Theme Options → Sidebar → Show as Off-Canvas Sidebar on Mobile

     • The Filter Toggle generates a mobile off-canvas button.
     • Without the Toggle element, no filter button will appear.
4. Horizontal Filters
   • The Filter Toggle displays the filter bar pulled from the Woo Category Filter sidebar in Appearance > Widgets page.
   • It opens/closes the horizontal filtering panel.
   • Used together with “Shop Page Subcategories” and other archive elements.

• The editor's preview may not exactly match the frontend. Always check the live shop page to confirm filter behavior.
• When no filter widgets exist in the related sidebar area, the Filter Toggle may appear inactive or invisible.
• Multiple instances should not be added; always use only one Filter Toggle per archive layout.
• For full logic and detailed relationships between filter layouts and widgets, see the related documentation Filter Layout Settings for Porto Product Archives.