{"id":4715,"date":"2022-02-13T16:38:08","date_gmt":"2022-02-13T16:38:08","guid":{"rendered":"https:\/\/d-themes.com\/wordpress\/udesign\/documentation\/?p=4715"},"modified":"2024-11-07T01:16:34","modified_gmt":"2024-11-07T01:16:34","slug":"filter-toggle-element","status":"publish","type":"post","link":"https:\/\/d-themes.com\/wordpress\/udesign\/documentation\/2022\/02\/13\/filter-toggle-element\/","title":{"rendered":"Filter Toggle Element"},"content":{"rendered":"\n<p><strong>Filter Toggle<\/strong> element shows or hides shop sidebar filter widgets. It is called <strong>Sidebar (Filter) Toggle<\/strong> in shop builder. <strong>When you use shop builder<\/strong>, this is an <strong>essential element<\/strong> for filtering products on mobile and offcanvas sidebar layouts.<\/p>\n\n\n\n<h4 class=\"wp-block-heading\">How to create filter toggle element?<\/h4>\n\n\n\n<p><strong>Step 1<\/strong>&nbsp;\u2013 Please create, or choose the Column into which you want to add your element. Click on Add New Element.<\/p>\n\n\n\n<p><strong>Step 2<\/strong>&nbsp;\u2013 Select UDesign Filter Toggle Element from the Element List.<\/p>\n\n\n\n<p><strong>Step 3<\/strong>&nbsp;\u2013 Configure the UDesign Filter Toggle Element to some place into your content.<\/p>\n\n\n\n<p><strong>Step 4<\/strong>&nbsp;\u2013 After you finish your configuration, don\u2019t forget to save all changes.<\/p>\n\n\n\n<h4 class=\"wp-block-heading\"><strong>Element Content Options<\/strong><\/h4>\n\n\n\n<p>Filter toggle element offers various options and you can change as you wish.<\/p>\n\n\n\n<p><strong>Sidebar Type:<\/strong>&nbsp;There are 4 types of sidebar \u2013 None, Top, Left and Right.<\/p>\n\n\n\n<p><strong>Label:<\/strong>&nbsp;You can change filter toggle label.<\/p>\n\n\n\n<p><strong>Type:<\/strong>&nbsp;You can change filter toggle type \u2013 Default, Gradient, Outline and Link.<\/p>\n\n\n\n<p><strong>Skin:<\/strong>&nbsp;You can choose skin color as you like.<\/p>\n\n\n\n<p><strong>Size:<\/strong>&nbsp;You can choose filter toggle size.<\/p>\n\n\n\n<p><strong>Box Shadow:<\/strong>&nbsp;You can set box shadow.<\/p>\n\n\n\n<p><strong>Border Style:<\/strong>&nbsp;You can set border style.<\/p>\n\n\n\n<p><strong>Show Icon:<\/strong>&nbsp;You can show icon by enabling this option.<\/p>\n\n\n\n<h4 class=\"wp-block-heading\">Element Style Options<\/h4>\n\n\n\n<p>You can change filter toggle styles as you want.<\/p>\n\n\n\n<p><strong>Text Typography:<\/strong>&nbsp;You can set text typography.<\/p>\n\n\n\n<p><strong>Padding:<\/strong>&nbsp;You can resize filter toggle padding.<\/p>\n\n\n\n<p><strong>Border Width:<\/strong>&nbsp;You can set border width.<\/p>\n\n\n\n<p><strong>Color, Background-Color, Border-Color:<\/strong>&nbsp;You can choose color as you like.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>Filter Toggle element shows or hides shop sidebar filter widgets. It is called Sidebar (Filter) Toggle in shop builder. When you use shop builder, this is an essential element for filtering products on mobile and offcanvas sidebar layouts. How to create filter toggle element? Step 1&nbsp;\u2013 Please create, or choose the Column into which you [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_monsterinsights_skip_tracking":false,"_monsterinsights_sitenote_active":false,"_monsterinsights_sitenote_note":"","_monsterinsights_sitenote_category":0,"footnotes":""},"categories":[30],"tags":[],"class_list":["post-4715","post","type-post","status-publish","format-standard","hentry","category-shop-builder"],"_links":{"self":[{"href":"https:\/\/d-themes.com\/wordpress\/udesign\/documentation\/wp-json\/wp\/v2\/posts\/4715","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/d-themes.com\/wordpress\/udesign\/documentation\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/d-themes.com\/wordpress\/udesign\/documentation\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/d-themes.com\/wordpress\/udesign\/documentation\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/d-themes.com\/wordpress\/udesign\/documentation\/wp-json\/wp\/v2\/comments?post=4715"}],"version-history":[{"count":2,"href":"https:\/\/d-themes.com\/wordpress\/udesign\/documentation\/wp-json\/wp\/v2\/posts\/4715\/revisions"}],"predecessor-version":[{"id":10979,"href":"https:\/\/d-themes.com\/wordpress\/udesign\/documentation\/wp-json\/wp\/v2\/posts\/4715\/revisions\/10979"}],"wp:attachment":[{"href":"https:\/\/d-themes.com\/wordpress\/udesign\/documentation\/wp-json\/wp\/v2\/media?parent=4715"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/d-themes.com\/wordpress\/udesign\/documentation\/wp-json\/wp\/v2\/categories?post=4715"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/d-themes.com\/wordpress\/udesign\/documentation\/wp-json\/wp\/v2\/tags?post=4715"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}