{"id":197,"date":"2025-07-17T09:02:37","date_gmt":"2025-07-17T09:02:37","guid":{"rendered":"https:\/\/wptabs.com\/docs\/?post_type=docs&#038;p=197"},"modified":"2025-07-18T08:45:18","modified_gmt":"2025-07-18T08:45:18","slug":"how-to-configure-tabs-mood-on-a-small-screen","status":"publish","type":"docs","link":"https:\/\/wptabs.com\/docs\/how-to-configure-tabs-mood-on-a-small-screen\/","title":{"rendered":"How to configure Tabs Mood on a Small Screen?"},"content":{"rendered":"\n<p>You can choose how your tabs behave on small screens, such as mobile devices. You can select \u201cFull Width\u201d to maintain the current layout or \u201cAccordion\u201d to switch to a collapsible format. Follow the steps below to do it:&nbsp;<\/p>\n\n\n\n<p>1. Navigate to Smart Tabs \u2192 Click on Add New Tab Group.<\/p>\n\n\n\n<p>2. Select any tab type you want from the Tabs Type option. Two options are available:<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Content<\/li>\n\n\n\n<li>Post<\/li>\n<\/ul>\n\n\n\n<figure class=\"wp-block-image size-large\"><img decoding=\"async\" width=\"1024\" height=\"502\" src=\"https:\/\/wptabs.com\/docs\/wp-content\/uploads\/2025\/07\/smart-tabs-tabs-type-1024x502.png\" alt=\"\" class=\"wp-image-153\" srcset=\"https:\/\/wptabs.com\/docs\/wp-content\/uploads\/2025\/07\/smart-tabs-tabs-type-1024x502.png 1024w, https:\/\/wptabs.com\/docs\/wp-content\/uploads\/2025\/07\/smart-tabs-tabs-type-300x147.png 300w, https:\/\/wptabs.com\/docs\/wp-content\/uploads\/2025\/07\/smart-tabs-tabs-type-768x376.png 768w, https:\/\/wptabs.com\/docs\/wp-content\/uploads\/2025\/07\/smart-tabs-tabs-type-1536x752.png 1536w, https:\/\/wptabs.com\/docs\/wp-content\/uploads\/2025\/07\/smart-tabs-tabs-type-2048x1003.png 2048w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><\/figure>\n\n\n\n<p>3. Under the Display Options > Responsive Screen tab, you can find the Tabs Mode on Small Screen option. By default, it is selected to Full Width.\u00a0<\/p>\n\n\n\n<figure class=\"wp-block-image size-large\"><img decoding=\"async\" width=\"1024\" height=\"549\" src=\"https:\/\/wptabs.com\/docs\/wp-content\/uploads\/2025\/07\/smart-tabs-on-small-screen-1024x549.png\" alt=\"\" class=\"wp-image-358\" srcset=\"https:\/\/wptabs.com\/docs\/wp-content\/uploads\/2025\/07\/smart-tabs-on-small-screen-1024x549.png 1024w, https:\/\/wptabs.com\/docs\/wp-content\/uploads\/2025\/07\/smart-tabs-on-small-screen-300x161.png 300w, https:\/\/wptabs.com\/docs\/wp-content\/uploads\/2025\/07\/smart-tabs-on-small-screen-768x412.png 768w, https:\/\/wptabs.com\/docs\/wp-content\/uploads\/2025\/07\/smart-tabs-on-small-screen-1536x823.png 1536w, https:\/\/wptabs.com\/docs\/wp-content\/uploads\/2025\/07\/smart-tabs-on-small-screen.png 1925w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><\/figure>\n\n\n\n<p>4. Select the Accordion option to switch your tabs into a collapsible format on mobile devices.\u00a0<\/p>\n\n\n\n<p>5. When you select the Accordion option, another option will appear as Expand and Collapse Icon. Enable the option to show the expand and collapse icons on mobile devices.<\/p>\n\n\n\n<figure class=\"wp-block-image size-full\"><img decoding=\"async\" width=\"387\" height=\"761\" src=\"https:\/\/wptabs.com\/docs\/wp-content\/uploads\/2025\/07\/Smart-Tabs-Pro-Tabs-Mood-Full-Width.png\" alt=\"\" class=\"wp-image-360\" srcset=\"https:\/\/wptabs.com\/docs\/wp-content\/uploads\/2025\/07\/Smart-Tabs-Pro-Tabs-Mood-Full-Width.png 387w, https:\/\/wptabs.com\/docs\/wp-content\/uploads\/2025\/07\/Smart-Tabs-Pro-Tabs-Mood-Full-Width-153x300.png 153w\" sizes=\"(max-width: 387px) 100vw, 387px\" \/><figcaption class=\"wp-element-caption\">Screenshot: (Tabs Mode on Small Screen \u2013 Full Width)<\/figcaption><\/figure>\n\n\n\n<figure class=\"wp-block-image size-full\"><img decoding=\"async\" width=\"389\" height=\"714\" src=\"https:\/\/wptabs.com\/docs\/wp-content\/uploads\/2025\/07\/Smart-Tabs-Pro-Tabs-Mood-Accordion.png\" alt=\"\" class=\"wp-image-361\" srcset=\"https:\/\/wptabs.com\/docs\/wp-content\/uploads\/2025\/07\/Smart-Tabs-Pro-Tabs-Mood-Accordion.png 389w, https:\/\/wptabs.com\/docs\/wp-content\/uploads\/2025\/07\/Smart-Tabs-Pro-Tabs-Mood-Accordion-163x300.png 163w\" sizes=\"(max-width: 389px) 100vw, 389px\" \/><figcaption class=\"wp-element-caption\">Screenshot: (Tabs Mode on Small Screen \u2013 Accordion)<\/figcaption><\/figure>\n\n\n\n<figure class=\"wp-block-image size-full\"><img decoding=\"async\" width=\"387\" height=\"644\" src=\"https:\/\/wptabs.com\/docs\/wp-content\/uploads\/2025\/07\/Smart-Tabs-Pro-Tabs-Mood-Expand-and-Collapse-Icon.png\" alt=\"\" class=\"wp-image-362\" srcset=\"https:\/\/wptabs.com\/docs\/wp-content\/uploads\/2025\/07\/Smart-Tabs-Pro-Tabs-Mood-Expand-and-Collapse-Icon.png 387w, https:\/\/wptabs.com\/docs\/wp-content\/uploads\/2025\/07\/Smart-Tabs-Pro-Tabs-Mood-Expand-and-Collapse-Icon-180x300.png 180w\" sizes=\"(max-width: 387px) 100vw, 387px\" \/><figcaption class=\"wp-element-caption\">Screenshot: (Tabs Mode on Small Screen \u2013 Accordion with Expand and Collapse Icon)<\/figcaption><\/figure>\n\n\n\n<p><\/p>\n","protected":false},"parent":0,"menu_order":52,"template":"","docs_cat":[7],"class_list":["post-197","docs","type-docs","status-publish","hentry","docs_cat-how-to-configurations"],"_links":{"self":[{"href":"https:\/\/wptabs.com\/docs\/wp-json\/wp\/v2\/docs\/197","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/wptabs.com\/docs\/wp-json\/wp\/v2\/docs"}],"about":[{"href":"https:\/\/wptabs.com\/docs\/wp-json\/wp\/v2\/types\/docs"}],"version-history":[{"count":0,"href":"https:\/\/wptabs.com\/docs\/wp-json\/wp\/v2\/docs\/197\/revisions"}],"wp:attachment":[{"href":"https:\/\/wptabs.com\/docs\/wp-json\/wp\/v2\/media?parent=197"}],"wp:term":[{"taxonomy":"docs_cat","embeddable":true,"href":"https:\/\/wptabs.com\/docs\/wp-json\/wp\/v2\/docs_cat?post=197"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}