{"id":1751,"date":"2024-09-26T13:44:50","date_gmt":"2024-09-26T13:44:50","guid":{"rendered":"http:\/\/docs"},"modified":"2024-09-26T13:44:50","modified_gmt":"2024-09-26T13:44:50","password":"","slug":"how-to-close-widgets-by-default","status":"publish","type":"docs","link":"https:\/\/www.8theme.com\/documentation\/xstore\/additional-customisation\/how-to-close-widgets-by-default\/","title":{"rendered":"How to close widgets by default"},"content":{"rendered":"<p>If you use toggle option for the sidebar widgets on the shop page and want to close them by default follow the instructions\u00a0to implement this by simple additional customization.<\/p>\n<p>Add the following code to <code class=\"inline-code\">custom.js<\/code> file:<\/p>\n<div data-html-block=\"\">\n<dl>\n<dt>1. Install and activate child theme.<\/dt>\n<dt>2. Create <code class=\"inline-code\">js<\/code> folder in your child theme and <code class=\"inline-code\">custom.js<\/code> file inside.<\/dt>\n<dt>3. Add the following code to <code class=\"inline-code\">custom.js<\/code> file:<\/dt>\n<\/dl>\n<\/div>\n<pre>jQuery(document).ready(function($){\n\tif ( $('body').is('.archive.woocommerce-page.s_widgets-open-close') ) {\n\n        if ( $('body').is('.swc-default') ) {\n            $('.sidebar-widget .widget-title').parent().addClass('et_widget-closed');\n            $('.sidebar-widget .widget-title').parent().find('&gt; ul, &gt; select, &gt; div:not(.widget-title), &gt; p:not(.widget-title), &gt; form').hide();\n            $('body').removeClass('swc-default');\n\n        }\n\t}\n});\n<\/pre>\n<p>Enqueue custom script in child theme <code class=\"inline-code\">function.php<\/code>:\u00a0<code class=\"inline-code\">wp_enqueue_script('et-custom-js', get_stylesheet_directory_uri().'js\/custom.js', array(),false,true);<\/code><\/p>\n<p>Add the code below to your child theme <code class=\"inline-code\">functions.php<\/code><\/p>\n<p><img decoding=\"async\" style=\"width: 100%; max-width: 100%;\" src=\"https:\/\/s3.amazonaws.com\/helpscout.net\/docs\/assets\/5809d09590336070ba24798e\/images\/5bf91e532c7d3a31944e4e1e\/file-B2p9684amR.jpg\" \/><\/p>\n<pre>add_filter( 'body_class', 'custom_body_class' );\nfunction custom_body_class ($classes) {\n    $classes[] = 'swc-default';\n    return $classes;\n}\n<\/pre>\n<p>Add the styles below to the child theme <code class=\"inline-code\">style.css <\/code><\/p>\n<pre>.archive.woocommerce-page.s_widgets-open-close.swc-default .sidebar .sidebar-  widget:not(.sidebar-slider) .widget-title span:after {\n    content: 'e910';\n}\n.archive.woocommerce-page.s_widgets-open-close.swc-default .sidebar .sidebar-widget:not(.sidebar-slider) .widget-title {\n\tmargin-bottom: 0;\n}\n.archive.woocommerce-page.s_widgets-open-close.swc-default .sidebar .sidebar-widget:not(.sidebar-slider) {\n\tmargin-bottom: 15px;\n}\n.archive.woocommerce-page.s_widgets-open-close.swc-default .sidebar .sidebar-widget:not(.sidebar-slider) &gt; ul, \n.archive.woocommerce-page.s_widgets-open-close.swc-default .sidebar .sidebar-widget:not(.sidebar-slider) &gt; select, \n.archive.woocommerce-page.s_widgets-open-close.swc-default .sidebar .sidebar-widget:not(.sidebar-slider) &gt; div:not(.widget-title), \n.archive.woocommerce-page.s_widgets-open-close.swc-default .sidebar .sidebar-widget:not(.sidebar-slider) &gt; p:not(.widget-title), \n.archive.woocommerce-page.s_widgets-open-close.swc-default .sidebar .sidebar-widget:not(.sidebar-slider) &gt; form {\n\topacity: 0;\n\tdisplay: none;\n}\n<\/pre>\n","protected":false},"excerpt":{"rendered":"<p>If you use toggle option for the sidebar widgets on the shop page and want to close them by default follow the instructions\u00a0to implement this by simple additional customization. Add the following code to custom.js file: 1. Install and activate child theme. 2. Create js folder in your child theme and custom.js file inside. 3. [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"closed","template":"","meta":{"om_disable_all_campaigns":false,"_monsterinsights_skip_tracking":false,"_monsterinsights_sitenote_active":false,"_monsterinsights_sitenote_note":"","_monsterinsights_sitenote_category":0,"footnotes":""},"doc_category":[42],"doc_tag":[],"class_list":["post-1751","docs","type-docs","status-publish","hentry","doc_category-additional-customisation"],"aioseo_notices":[],"year_month":"2026-04","word_count":269,"total_views":"3310","reactions":{"happy":"0","normal":"0","sad":"0"},"author_info":{"author_nicename":"docs","author_url":"https:\/\/www.8theme.com\/documentation\/author\/docs\/"},"doc_category_info":[{"term_name":"Additional Customization","term_url":"https:\/\/www.8theme.com\/documentation\/xstore\/additional-customisation\/"}],"doc_tag_info":[],"author_list":[{"ID":"1","user_login":"docs","display_name":"docs","id":"1"}],"knowledge_base_info":[],"knowledge_base_slug":[],"_links":{"self":[{"href":"https:\/\/www.8theme.com\/documentation\/wp-json\/wp\/v2\/docs\/1751","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.8theme.com\/documentation\/wp-json\/wp\/v2\/docs"}],"about":[{"href":"https:\/\/www.8theme.com\/documentation\/wp-json\/wp\/v2\/types\/docs"}],"author":[{"embeddable":true,"href":"https:\/\/www.8theme.com\/documentation\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.8theme.com\/documentation\/wp-json\/wp\/v2\/comments?post=1751"}],"version-history":[{"count":0,"href":"https:\/\/www.8theme.com\/documentation\/wp-json\/wp\/v2\/docs\/1751\/revisions"}],"wp:attachment":[{"href":"https:\/\/www.8theme.com\/documentation\/wp-json\/wp\/v2\/media?parent=1751"}],"wp:term":[{"taxonomy":"doc_category","embeddable":true,"href":"https:\/\/www.8theme.com\/documentation\/wp-json\/wp\/v2\/doc_category?post=1751"},{"taxonomy":"doc_tag","embeddable":true,"href":"https:\/\/www.8theme.com\/documentation\/wp-json\/wp\/v2\/doc_tag?post=1751"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}