{"id":941,"date":"2020-11-06T11:37:59","date_gmt":"2020-11-06T18:37:59","guid":{"rendered":"https:\/\/kadence-theme.com\/?post_type=knowledgebase&#038;p=941"},"modified":"2026-01-02T20:24:28","modified_gmt":"2026-01-02T20:24:28","password":"","slug":"customizing-the-mobile-navigation-area","status":"publish","type":"docs","link":"https:\/\/www.kadencewp.com\/help-center\/docs\/kadence-theme\/customizing-the-mobile-navigation-area\/","title":{"rendered":"Customizing the Mobile Navigation Area"},"content":{"rendered":"\n<p>Kadence creates two separate and distinct headers for your site: one for Desktop and one for Tablet\/Mobile. In this guide, we&#8217;ll show you how to access and customize the Tablet\/Mobile navigation area.<\/p>\n\n\n<style>.kb-table-of-content-nav.kb-table-of-content-id941_b6924a-ba .kb-table-of-content-wrap{padding-top:var(--global-kb-spacing-sm, 1.5rem);padding-right:var(--global-kb-spacing-sm, 1.5rem);padding-bottom:var(--global-kb-spacing-sm, 1.5rem);padding-left:var(--global-kb-spacing-sm, 1.5rem);}.kb-table-of-content-nav.kb-table-of-content-id941_b6924a-ba .kb-table-of-contents-title-wrap{padding-top:0px;padding-right:0px;padding-bottom:0px;padding-left:0px;}.kb-table-of-content-nav.kb-table-of-content-id941_b6924a-ba .kb-table-of-contents-title{font-weight:regular;font-style:normal;}.kb-table-of-content-nav.kb-table-of-content-id941_b6924a-ba .kb-table-of-content-wrap .kb-table-of-content-list{font-weight:regular;font-style:normal;margin-top:var(--global-kb-spacing-sm, 1.5rem);margin-right:0px;margin-bottom:0px;margin-left:0px;}<\/style>\n\n<style>.wp-block-kadence-advancedheading.kt-adv-heading941_b8d2f2-ad, .wp-block-kadence-advancedheading.kt-adv-heading941_b8d2f2-ad[data-kb-block=\"kb-adv-heading941_b8d2f2-ad\"]{font-style:normal;}.wp-block-kadence-advancedheading.kt-adv-heading941_b8d2f2-ad mark.kt-highlight, .wp-block-kadence-advancedheading.kt-adv-heading941_b8d2f2-ad[data-kb-block=\"kb-adv-heading941_b8d2f2-ad\"] mark.kt-highlight{font-style:normal;color:#f76a0c;-webkit-box-decoration-break:clone;box-decoration-break:clone;padding-top:0px;padding-right:0px;padding-bottom:0px;padding-left:0px;}.wp-block-kadence-advancedheading.kt-adv-heading941_b8d2f2-ad img.kb-inline-image, .wp-block-kadence-advancedheading.kt-adv-heading941_b8d2f2-ad[data-kb-block=\"kb-adv-heading941_b8d2f2-ad\"] img.kb-inline-image{width:150px;vertical-align:baseline;}<\/style>\n<h2 id=\"navigate-to-headers-in-the-customizer\" class=\"kt-adv-heading941_b8d2f2-ad wp-block-kadence-advancedheading\" data-kb-block=\"kb-adv-heading941_b8d2f2-ad\">Navigate to Headers in the Customizer<\/h2>\n\n\n\n<p>From the WP Admin menu, go to Appearance \u2192 Customizer and click on Header. From here, click on the <strong>Mobile\/Tablet<\/strong> tab to access the mobile header layout.<\/p>\n\n\n<style>.kb-image941_550f13-14 .kb-image-has-overlay:after{opacity:0.3;}<\/style>\n<figure class=\"wp-block-kadence-image kb-image941_550f13-14 size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"2560\" height=\"1347\" src=\"https:\/\/www.kadencewp.com\/help-center\/wp-content\/uploads\/sites\/14\/2020\/11\/Screenshot-2025-10-16-at-9.20.55-AM-scaled.png\" alt=\"Customizer - Kadence Header - Tablet\/Mobile\" class=\"kb-img wp-image-15652\" srcset=\"https:\/\/www.kadencewp.com\/help-center\/wp-content\/uploads\/sites\/14\/2020\/11\/Screenshot-2025-10-16-at-9.20.55-AM-scaled.png 2560w, https:\/\/www.kadencewp.com\/help-center\/wp-content\/uploads\/sites\/14\/2020\/11\/Screenshot-2025-10-16-at-9.20.55-AM-300x158.png 300w, https:\/\/www.kadencewp.com\/help-center\/wp-content\/uploads\/sites\/14\/2020\/11\/Screenshot-2025-10-16-at-9.20.55-AM-1024x539.png 1024w, https:\/\/www.kadencewp.com\/help-center\/wp-content\/uploads\/sites\/14\/2020\/11\/Screenshot-2025-10-16-at-9.20.55-AM-768x404.png 768w, https:\/\/www.kadencewp.com\/help-center\/wp-content\/uploads\/sites\/14\/2020\/11\/Screenshot-2025-10-16-at-9.20.55-AM-1536x808.png 1536w, https:\/\/www.kadencewp.com\/help-center\/wp-content\/uploads\/sites\/14\/2020\/11\/Screenshot-2025-10-16-at-9.20.55-AM-2048x1077.png 2048w, https:\/\/www.kadencewp.com\/help-center\/wp-content\/uploads\/sites\/14\/2020\/11\/Screenshot-2025-10-16-at-9.20.55-AM-360x189.png 360w\" sizes=\"auto, (max-width: 2560px) 100vw, 2560px\" \/><\/figure>\n\n\n<style>.wp-block-kadence-advancedheading.kt-adv-heading941_681b09-b9, .wp-block-kadence-advancedheading.kt-adv-heading941_681b09-b9[data-kb-block=\"kb-adv-heading941_681b09-b9\"]{font-style:normal;}.wp-block-kadence-advancedheading.kt-adv-heading941_681b09-b9 mark.kt-highlight, .wp-block-kadence-advancedheading.kt-adv-heading941_681b09-b9[data-kb-block=\"kb-adv-heading941_681b09-b9\"] mark.kt-highlight{font-style:normal;color:#f76a0c;-webkit-box-decoration-break:clone;box-decoration-break:clone;padding-top:0px;padding-right:0px;padding-bottom:0px;padding-left:0px;}.wp-block-kadence-advancedheading.kt-adv-heading941_681b09-b9 img.kb-inline-image, .wp-block-kadence-advancedheading.kt-adv-heading941_681b09-b9[data-kb-block=\"kb-adv-heading941_681b09-b9\"] img.kb-inline-image{width:150px;vertical-align:baseline;}<\/style>\n<h2 id=\"the-mobile-navigation-components\" class=\"kt-adv-heading941_681b09-b9 wp-block-kadence-advancedheading\" data-kb-block=\"kb-adv-heading941_681b09-b9\">The Mobile Navigation Components<\/h2>\n\n\n\n<p>The mobile navigation consists of two main components:  The Trigger and Mobile Navigation blocks.<\/p>\n\n\n\n<p>The <strong>Mobile Navigation<\/strong> block is added to the Off Canvas area.  This is the area that appears when the Trigger is tapped.  The Off Canvas area can also contain other blocks such as buttons, socials, search bar, etc&#8230;<\/p>\n\n\n\n<p>The <strong>Trigger<\/strong> block (also known as the &#8220;hamburger&#8221; menu icon) opens and closes the mobile menu. This block is typically added to the Main Row (center row) of the header.<\/p>\n\n\n<style>.kb-image941_c735b7-8e .kb-image-has-overlay:after{opacity:0.3;}<\/style>\n<figure class=\"wp-block-kadence-image kb-image941_c735b7-8e size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"2560\" height=\"478\" src=\"https:\/\/www.kadencewp.com\/help-center\/wp-content\/uploads\/sites\/14\/2020\/11\/Screenshot-2025-10-16-at-9.40.59-AM-scaled.png\" alt=\"Tablet\/Mobile Header - Trigger and Mobile Navigation blocks\" class=\"kb-img wp-image-15653\" srcset=\"https:\/\/www.kadencewp.com\/help-center\/wp-content\/uploads\/sites\/14\/2020\/11\/Screenshot-2025-10-16-at-9.40.59-AM-scaled.png 2560w, https:\/\/www.kadencewp.com\/help-center\/wp-content\/uploads\/sites\/14\/2020\/11\/Screenshot-2025-10-16-at-9.40.59-AM-300x56.png 300w, https:\/\/www.kadencewp.com\/help-center\/wp-content\/uploads\/sites\/14\/2020\/11\/Screenshot-2025-10-16-at-9.40.59-AM-1024x191.png 1024w, https:\/\/www.kadencewp.com\/help-center\/wp-content\/uploads\/sites\/14\/2020\/11\/Screenshot-2025-10-16-at-9.40.59-AM-768x143.png 768w, https:\/\/www.kadencewp.com\/help-center\/wp-content\/uploads\/sites\/14\/2020\/11\/Screenshot-2025-10-16-at-9.40.59-AM-1536x287.png 1536w, https:\/\/www.kadencewp.com\/help-center\/wp-content\/uploads\/sites\/14\/2020\/11\/Screenshot-2025-10-16-at-9.40.59-AM-2048x382.png 2048w, https:\/\/www.kadencewp.com\/help-center\/wp-content\/uploads\/sites\/14\/2020\/11\/Screenshot-2025-10-16-at-9.40.59-AM-360x67.png 360w\" sizes=\"auto, (max-width: 2560px) 100vw, 2560px\" \/><\/figure>\n\n\n\n<p>Whenever you click the <strong>Trigger<\/strong>, it toggles and opens the <strong>Off-Canvas<\/strong> area, as shown in the GIF below.<\/p>\n\n\n<style>.kb-image941_0050a3-0b.kb-image-is-ratio-size, .kb-image941_0050a3-0b .kb-image-is-ratio-size{max-width:200px;width:100%;}.wp-block-kadence-column > .kt-inside-inner-col > .kb-image941_0050a3-0b.kb-image-is-ratio-size, .wp-block-kadence-column > .kt-inside-inner-col > .kb-image941_0050a3-0b .kb-image-is-ratio-size{align-self:unset;}.kb-image941_0050a3-0b figure{max-width:200px;}.kb-image941_0050a3-0b .image-is-svg, .kb-image941_0050a3-0b .image-is-svg img{width:100%;}.kb-image941_0050a3-0b .kb-image-has-overlay:after{opacity:0.3;}<\/style>\n<div class=\"wp-block-kadence-image kb-image941_0050a3-0b\"><figure class=\"aligncenter size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"543\" height=\"703\" src=\"https:\/\/www.kadencewp.com\/help-center\/wp-content\/uploads\/sites\/14\/2020\/11\/Off-Canvas-Demo.gif\" alt=\"Off Canvas Demo\" class=\"kb-img wp-image-16566\" \/><\/figure><\/div>\n\n\n\n<p>Additional header items can be added to either one of the <strong>Header Rows<\/strong> or inside the <strong>Off-Canvas<\/strong> area, depending on where you want the item to appear. Either drag an item from the available items over to the visual builder or hover over an area of the visual builder and click the plus icon to add an item.<\/p>\n\n\n\n<p>Additionally, you can use the <strong>gear settings icons<\/strong> to modify each <strong>Header Row<\/strong>, customize the <strong>Off-Canvas Area<\/strong>, and edit each <strong>Header Item<\/strong> within the header.<\/p>\n\n\n<style>.kb-image941_54c768-8b .kb-image-has-overlay:after{opacity:0.3;}<\/style>\n<figure class=\"wp-block-kadence-image kb-image941_54c768-8b size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"1510\" height=\"815\" src=\"https:\/\/www.kadencewp.com\/help-center\/wp-content\/uploads\/sites\/14\/2020\/11\/Mobile-Navigation-and-Header-Settings.gif\" alt=\"Mobile Navigation and Header Settings\" class=\"kb-img wp-image-16567\" \/><\/figure>\n\n\n<style>.wp-block-kadence-advancedheading.kt-adv-heading941_bd24bc-dd, .wp-block-kadence-advancedheading.kt-adv-heading941_bd24bc-dd[data-kb-block=\"kb-adv-heading941_bd24bc-dd\"]{font-style:normal;}.wp-block-kadence-advancedheading.kt-adv-heading941_bd24bc-dd mark.kt-highlight, .wp-block-kadence-advancedheading.kt-adv-heading941_bd24bc-dd[data-kb-block=\"kb-adv-heading941_bd24bc-dd\"] mark.kt-highlight{font-style:normal;color:#f76a0c;-webkit-box-decoration-break:clone;box-decoration-break:clone;padding-top:0px;padding-right:0px;padding-bottom:0px;padding-left:0px;}.wp-block-kadence-advancedheading.kt-adv-heading941_bd24bc-dd img.kb-inline-image, .wp-block-kadence-advancedheading.kt-adv-heading941_bd24bc-dd[data-kb-block=\"kb-adv-heading941_bd24bc-dd\"] img.kb-inline-image{width:150px;vertical-align:baseline;}<\/style>\n<h2 id=\"customizing-the-mobile-navigation-block\" class=\"kt-adv-heading941_bd24bc-dd wp-block-kadence-advancedheading\" data-kb-block=\"kb-adv-heading941_bd24bc-dd\">Customizing the Mobile Navigation Block<\/h2>\n\n\n<style>.kb-row-layout-id941_ae5055-7a > .kt-row-column-wrap{align-content:start;}:where(.kb-row-layout-id941_ae5055-7a > .kt-row-column-wrap) > .wp-block-kadence-column{justify-content:start;}.kb-row-layout-id941_ae5055-7a > .kt-row-column-wrap{column-gap:var(--global-kb-gap-md, 2rem);row-gap:var(--global-kb-gap-md, 2rem);padding-top:var(--global-kb-spacing-sm, 1.5rem);padding-bottom:var(--global-kb-spacing-sm, 1.5rem);grid-template-columns:minmax(0, 2fr) minmax(0, 1fr);}.kb-row-layout-id941_ae5055-7a > .kt-row-layout-overlay{opacity:0.30;}@media all and (max-width: 1024px){.kb-row-layout-id941_ae5055-7a > .kt-row-column-wrap{grid-template-columns:minmax(0, 2fr) minmax(0, 1fr);}}@media all and (max-width: 767px){.kb-row-layout-id941_ae5055-7a > .kt-row-column-wrap{grid-template-columns:minmax(0, 1fr);}}<\/style><div class=\"kb-row-layout-wrap kb-row-layout-id941_ae5055-7a alignnone wp-block-kadence-rowlayout\"><div class=\"kt-row-column-wrap kt-has-2-columns kt-row-layout-left-golden kt-tab-layout-inherit kt-mobile-layout-row kt-row-valign-top\">\n<style>.kadence-column941_2d50c7-43 > .kt-inside-inner-col,.kadence-column941_2d50c7-43 > .kt-inside-inner-col:before{border-top-left-radius:0px;border-top-right-radius:0px;border-bottom-right-radius:0px;border-bottom-left-radius:0px;}.kadence-column941_2d50c7-43 > .kt-inside-inner-col{column-gap:var(--global-kb-gap-sm, 1rem);}.kadence-column941_2d50c7-43 > .kt-inside-inner-col{flex-direction:column;}.kadence-column941_2d50c7-43 > .kt-inside-inner-col > .aligncenter{width:100%;}.kadence-column941_2d50c7-43 > .kt-inside-inner-col:before{opacity:0.3;}.kadence-column941_2d50c7-43{position:relative;}@media all and (max-width: 1024px){.kadence-column941_2d50c7-43 > .kt-inside-inner-col{flex-direction:column;justify-content:center;}}@media all and (max-width: 767px){.kadence-column941_2d50c7-43 > .kt-inside-inner-col{flex-direction:column;justify-content:center;}}<\/style>\n<div class=\"wp-block-kadence-column kadence-column941_2d50c7-43\"><div class=\"kt-inside-inner-col\">\n<p>To customize the settings for the mobile navigation, click the gear icon in the Mobile Navigation block header. This will open the settings panel for the block.<\/p>\n<\/div><\/div>\n\n\n<style>.kadence-column941_d1479c-66 > .kt-inside-inner-col,.kadence-column941_d1479c-66 > .kt-inside-inner-col:before{border-top-left-radius:0px;border-top-right-radius:0px;border-bottom-right-radius:0px;border-bottom-left-radius:0px;}.kadence-column941_d1479c-66 > .kt-inside-inner-col{column-gap:var(--global-kb-gap-sm, 1rem);}.kadence-column941_d1479c-66 > .kt-inside-inner-col{flex-direction:column;}.kadence-column941_d1479c-66 > .kt-inside-inner-col > .aligncenter{width:100%;}.kadence-column941_d1479c-66 > .kt-inside-inner-col:before{opacity:0.3;}.kadence-column941_d1479c-66{position:relative;}@media all and (max-width: 1024px){.kadence-column941_d1479c-66 > .kt-inside-inner-col{flex-direction:column;justify-content:center;}}@media all and (max-width: 767px){.kadence-column941_d1479c-66 > .kt-inside-inner-col{flex-direction:column;justify-content:center;}}<\/style>\n<div class=\"wp-block-kadence-column kadence-column941_d1479c-66\"><div class=\"kt-inside-inner-col\"><style>.kb-image941_07df99-91 .kb-image-has-overlay:after{opacity:0.3;}<\/style>\n<figure class=\"wp-block-kadence-image kb-image941_07df99-91 size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"1144\" height=\"392\" src=\"https:\/\/www.kadencewp.com\/help-center\/wp-content\/uploads\/sites\/14\/2020\/11\/Screenshot-2025-10-16-at-10.00.47-AM.png\" alt=\"Mobile Navigation Settings Icon\" class=\"kb-img wp-image-15654\" srcset=\"https:\/\/www.kadencewp.com\/help-center\/wp-content\/uploads\/sites\/14\/2020\/11\/Screenshot-2025-10-16-at-10.00.47-AM.png 1144w, https:\/\/www.kadencewp.com\/help-center\/wp-content\/uploads\/sites\/14\/2020\/11\/Screenshot-2025-10-16-at-10.00.47-AM-300x103.png 300w, https:\/\/www.kadencewp.com\/help-center\/wp-content\/uploads\/sites\/14\/2020\/11\/Screenshot-2025-10-16-at-10.00.47-AM-1024x351.png 1024w, https:\/\/www.kadencewp.com\/help-center\/wp-content\/uploads\/sites\/14\/2020\/11\/Screenshot-2025-10-16-at-10.00.47-AM-768x263.png 768w, https:\/\/www.kadencewp.com\/help-center\/wp-content\/uploads\/sites\/14\/2020\/11\/Screenshot-2025-10-16-at-10.00.47-AM-360x123.png 360w\" sizes=\"auto, (max-width: 1144px) 100vw, 1144px\" \/><\/figure>\n<\/div><\/div>\n\n<\/div><\/div>\n\n<style>.wp-block-kadence-advancedheading.kt-adv-heading941_c51ffd-aa, .wp-block-kadence-advancedheading.kt-adv-heading941_c51ffd-aa[data-kb-block=\"kb-adv-heading941_c51ffd-aa\"]{font-style:normal;}.wp-block-kadence-advancedheading.kt-adv-heading941_c51ffd-aa mark.kt-highlight, .wp-block-kadence-advancedheading.kt-adv-heading941_c51ffd-aa[data-kb-block=\"kb-adv-heading941_c51ffd-aa\"] mark.kt-highlight{font-style:normal;color:#f76a0c;-webkit-box-decoration-break:clone;box-decoration-break:clone;padding-top:0px;padding-right:0px;padding-bottom:0px;padding-left:0px;}.wp-block-kadence-advancedheading.kt-adv-heading941_c51ffd-aa img.kb-inline-image, .wp-block-kadence-advancedheading.kt-adv-heading941_c51ffd-aa[data-kb-block=\"kb-adv-heading941_c51ffd-aa\"] img.kb-inline-image{width:150px;vertical-align:baseline;}<\/style>\n<h3 id=\"mobile-navigation-general-settings\" class=\"kt-adv-heading941_c51ffd-aa wp-block-kadence-advancedheading\" data-kb-block=\"kb-adv-heading941_c51ffd-aa\">Mobile Navigation &#8211; General Settings<\/h3>\n\n\n<style>.kb-row-layout-id941_31a5f5-28 > .kt-row-column-wrap{align-content:start;}:where(.kb-row-layout-id941_31a5f5-28 > .kt-row-column-wrap) > .wp-block-kadence-column{justify-content:start;}.kb-row-layout-id941_31a5f5-28 > .kt-row-column-wrap{column-gap:var(--global-kb-gap-md, 2rem);row-gap:var(--global-kb-gap-md, 2rem);padding-top:var(--global-kb-spacing-sm, 1.5rem);padding-bottom:var(--global-kb-spacing-sm, 1.5rem);grid-template-columns:minmax(0, 2fr) minmax(0, 1fr);}.kb-row-layout-id941_31a5f5-28 > .kt-row-layout-overlay{opacity:0.30;}@media all and (max-width: 1024px){.kb-row-layout-id941_31a5f5-28 > .kt-row-column-wrap{grid-template-columns:minmax(0, 2fr) minmax(0, 1fr);}}@media all and (max-width: 767px){.kb-row-layout-id941_31a5f5-28 > .kt-row-column-wrap{grid-template-columns:minmax(0, 1fr);}}<\/style><div class=\"kb-row-layout-wrap kb-row-layout-id941_31a5f5-28 alignnone wp-block-kadence-rowlayout\"><div class=\"kt-row-column-wrap kt-has-2-columns kt-row-layout-left-golden kt-tab-layout-inherit kt-mobile-layout-row kt-row-valign-top\">\n<style>.kadence-column941_0c65e4-7f > .kt-inside-inner-col,.kadence-column941_0c65e4-7f > .kt-inside-inner-col:before{border-top-left-radius:0px;border-top-right-radius:0px;border-bottom-right-radius:0px;border-bottom-left-radius:0px;}.kadence-column941_0c65e4-7f > .kt-inside-inner-col{column-gap:var(--global-kb-gap-sm, 1rem);}.kadence-column941_0c65e4-7f > .kt-inside-inner-col{flex-direction:column;}.kadence-column941_0c65e4-7f > .kt-inside-inner-col > .aligncenter{width:100%;}.kadence-column941_0c65e4-7f > .kt-inside-inner-col:before{opacity:0.3;}.kadence-column941_0c65e4-7f{position:relative;}@media all and (max-width: 1024px){.kadence-column941_0c65e4-7f > .kt-inside-inner-col{flex-direction:column;justify-content:center;}}@media all and (max-width: 767px){.kadence-column941_0c65e4-7f > .kt-inside-inner-col{flex-direction:column;justify-content:center;}}<\/style>\n<div class=\"wp-block-kadence-column kadence-column941_0c65e4-7f\"><div class=\"kt-inside-inner-col\">\n<p><strong>Select Menu<\/strong> &#8211; If you haven&#8217;t already done so, you should create a menu to be used for the mobile navigation. For more information about creating and editing menus, please see: <a href=\"https:\/\/www.kadencewp.com\/help-center\/docs\/kadence-general\/how-to-add-and-edit-a-wordpress-menu\/\" data-type=\"docs\" data-id=\"13173\">How to Add and Edit a WordPress Menu<\/a>.<\/p>\n\n\n\n<p><strong>Items Vertical Spacing<\/strong> &#8211; Controls the spacing between the menu items.<\/p>\n\n\n\n<p><strong>Collapse sub menu items?<\/strong> &#8211; If the menu has sub-menus, they will show as collapsible menus when this is enabled. Otherwise, the complete menu and sub-menus will show.<\/p>\n\n\n\n<p><strong>Entire parent menu item expands sub menu<\/strong> &#8211; When <em>Collapse sub menu items<\/em> is enabled, this allows you to control whether users can click the entire parent menu item (enabled) or only the arrow to open and close the menu (disabled).<\/p>\n<\/div><\/div>\n\n\n<style>.kadence-column941_fe84e7-03 > .kt-inside-inner-col,.kadence-column941_fe84e7-03 > .kt-inside-inner-col:before{border-top-left-radius:0px;border-top-right-radius:0px;border-bottom-right-radius:0px;border-bottom-left-radius:0px;}.kadence-column941_fe84e7-03 > .kt-inside-inner-col{column-gap:var(--global-kb-gap-sm, 1rem);}.kadence-column941_fe84e7-03 > .kt-inside-inner-col{flex-direction:column;}.kadence-column941_fe84e7-03 > .kt-inside-inner-col > .aligncenter{width:100%;}.kadence-column941_fe84e7-03 > .kt-inside-inner-col:before{opacity:0.3;}.kadence-column941_fe84e7-03{position:relative;}@media all and (max-width: 1024px){.kadence-column941_fe84e7-03 > .kt-inside-inner-col{flex-direction:column;justify-content:center;}}@media all and (max-width: 767px){.kadence-column941_fe84e7-03 > .kt-inside-inner-col{flex-direction:column;justify-content:center;}}<\/style>\n<div class=\"wp-block-kadence-column kadence-column941_fe84e7-03\"><div class=\"kt-inside-inner-col\"><style>.kb-image941_0aa8b2-d5 .kb-image-has-overlay:after{opacity:0.3;}<\/style>\n<figure class=\"wp-block-kadence-image kb-image941_0aa8b2-d5 size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"620\" height=\"910\" src=\"https:\/\/www.kadencewp.com\/help-center\/wp-content\/uploads\/sites\/14\/2020\/11\/Screenshot-2025-10-16-at-10.03.54-AM.png\" alt=\"Mobile Navigation - General Settings\" class=\"kb-img wp-image-15655\" srcset=\"https:\/\/www.kadencewp.com\/help-center\/wp-content\/uploads\/sites\/14\/2020\/11\/Screenshot-2025-10-16-at-10.03.54-AM.png 620w, https:\/\/www.kadencewp.com\/help-center\/wp-content\/uploads\/sites\/14\/2020\/11\/Screenshot-2025-10-16-at-10.03.54-AM-204x300.png 204w, https:\/\/www.kadencewp.com\/help-center\/wp-content\/uploads\/sites\/14\/2020\/11\/Screenshot-2025-10-16-at-10.03.54-AM-349x512.png 349w\" sizes=\"auto, (max-width: 620px) 100vw, 620px\" \/><\/figure>\n<\/div><\/div>\n\n<\/div><\/div>\n\n<style>.wp-block-kadence-advancedheading.kt-adv-heading941_2675cd-a4, .wp-block-kadence-advancedheading.kt-adv-heading941_2675cd-a4[data-kb-block=\"kb-adv-heading941_2675cd-a4\"]{font-style:normal;}.wp-block-kadence-advancedheading.kt-adv-heading941_2675cd-a4 mark.kt-highlight, .wp-block-kadence-advancedheading.kt-adv-heading941_2675cd-a4[data-kb-block=\"kb-adv-heading941_2675cd-a4\"] mark.kt-highlight{font-style:normal;color:#f76a0c;-webkit-box-decoration-break:clone;box-decoration-break:clone;padding-top:0px;padding-right:0px;padding-bottom:0px;padding-left:0px;}.wp-block-kadence-advancedheading.kt-adv-heading941_2675cd-a4 img.kb-inline-image, .wp-block-kadence-advancedheading.kt-adv-heading941_2675cd-a4[data-kb-block=\"kb-adv-heading941_2675cd-a4\"] img.kb-inline-image{width:150px;vertical-align:baseline;}<\/style>\n<h3 id=\"mobile-navigation-design-settings\" class=\"kt-adv-heading941_2675cd-a4 wp-block-kadence-advancedheading\" data-kb-block=\"kb-adv-heading941_2675cd-a4\">Mobile Navigation &#8211; Design Settings<\/h3>\n\n\n<style>.kb-row-layout-id941_77f229-48 > .kt-row-column-wrap{align-content:start;}:where(.kb-row-layout-id941_77f229-48 > .kt-row-column-wrap) > .wp-block-kadence-column{justify-content:start;}.kb-row-layout-id941_77f229-48 > .kt-row-column-wrap{column-gap:var(--global-kb-gap-md, 2rem);row-gap:var(--global-kb-gap-md, 2rem);padding-top:var(--global-kb-spacing-sm, 1.5rem);padding-bottom:var(--global-kb-spacing-sm, 1.5rem);grid-template-columns:minmax(0, 2fr) minmax(0, 1fr);}.kb-row-layout-id941_77f229-48 > .kt-row-layout-overlay{opacity:0.30;}@media all and (max-width: 1024px){.kb-row-layout-id941_77f229-48 > .kt-row-column-wrap{grid-template-columns:minmax(0, 2fr) minmax(0, 1fr);}}@media all and (max-width: 767px){.kb-row-layout-id941_77f229-48 > .kt-row-column-wrap{grid-template-columns:minmax(0, 1fr);}}<\/style><div class=\"kb-row-layout-wrap kb-row-layout-id941_77f229-48 alignnone wp-block-kadence-rowlayout\"><div class=\"kt-row-column-wrap kt-has-2-columns kt-row-layout-left-golden kt-tab-layout-inherit kt-mobile-layout-row kt-row-valign-top\">\n<style>.kadence-column941_32ed08-01 > .kt-inside-inner-col,.kadence-column941_32ed08-01 > .kt-inside-inner-col:before{border-top-left-radius:0px;border-top-right-radius:0px;border-bottom-right-radius:0px;border-bottom-left-radius:0px;}.kadence-column941_32ed08-01 > .kt-inside-inner-col{column-gap:var(--global-kb-gap-sm, 1rem);}.kadence-column941_32ed08-01 > .kt-inside-inner-col{flex-direction:column;}.kadence-column941_32ed08-01 > .kt-inside-inner-col > .aligncenter{width:100%;}.kadence-column941_32ed08-01 > .kt-inside-inner-col:before{opacity:0.3;}.kadence-column941_32ed08-01{position:relative;}@media all and (max-width: 1024px){.kadence-column941_32ed08-01 > .kt-inside-inner-col{flex-direction:column;justify-content:center;}}@media all and (max-width: 767px){.kadence-column941_32ed08-01 > .kt-inside-inner-col{flex-direction:column;justify-content:center;}}<\/style>\n<div class=\"wp-block-kadence-column kadence-column941_32ed08-01\"><div class=\"kt-inside-inner-col\">\n<p><strong>Colors<\/strong> &#8211; Set the <strong>Initial<\/strong>, <strong>Hover<\/strong>, and <strong>Active<\/strong> colors for the menu items.<\/p>\n\n\n\n<p><strong>Background<\/strong> &#8211; Set the <strong>Initial<\/strong>, <strong>Hover<\/strong>, and <strong>Active<\/strong> background colors for the menu items.<\/p>\n\n\n\n<p><strong>Item Divider<\/strong> &#8211; Set the <strong>Color<\/strong>, <strong>Thickness<\/strong> and <strong>Style<\/strong> of the menu item dividers.  Select <strong>X<\/strong> for style for no dividers.<\/p>\n\n\n\n<p><strong>Font<\/strong> &#8211; Select the <strong>Font<\/strong>, <strong>Style<\/strong>, and <strong>Size<\/strong> for the menu items. Clicking <strong>Size<\/strong> will open the font modal. Clicking the down arrow will show a preview of the selected font.<\/p>\n<\/div><\/div>\n\n\n<style>.kadence-column941_cb988f-49 > .kt-inside-inner-col,.kadence-column941_cb988f-49 > .kt-inside-inner-col:before{border-top-left-radius:0px;border-top-right-radius:0px;border-bottom-right-radius:0px;border-bottom-left-radius:0px;}.kadence-column941_cb988f-49 > .kt-inside-inner-col{column-gap:var(--global-kb-gap-sm, 1rem);}.kadence-column941_cb988f-49 > .kt-inside-inner-col{flex-direction:column;}.kadence-column941_cb988f-49 > .kt-inside-inner-col > .aligncenter{width:100%;}.kadence-column941_cb988f-49 > .kt-inside-inner-col:before{opacity:0.3;}.kadence-column941_cb988f-49{position:relative;}@media all and (max-width: 1024px){.kadence-column941_cb988f-49 > .kt-inside-inner-col{flex-direction:column;justify-content:center;}}@media all and (max-width: 767px){.kadence-column941_cb988f-49 > .kt-inside-inner-col{flex-direction:column;justify-content:center;}}<\/style>\n<div class=\"wp-block-kadence-column kadence-column941_cb988f-49\"><div class=\"kt-inside-inner-col\"><style>.kb-image941_5e57e4-8c .kb-image-has-overlay:after{opacity:0.3;}<\/style>\n<figure class=\"wp-block-kadence-image kb-image941_5e57e4-8c size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"620\" height=\"1022\" src=\"https:\/\/www.kadencewp.com\/help-center\/wp-content\/uploads\/sites\/14\/2020\/11\/Screenshot-2025-10-16-at-10.04.20-AM.png\" alt=\"Mobile Navigation - Design Settings\" class=\"kb-img wp-image-15661\" srcset=\"https:\/\/www.kadencewp.com\/help-center\/wp-content\/uploads\/sites\/14\/2020\/11\/Screenshot-2025-10-16-at-10.04.20-AM.png 620w, https:\/\/www.kadencewp.com\/help-center\/wp-content\/uploads\/sites\/14\/2020\/11\/Screenshot-2025-10-16-at-10.04.20-AM-182x300.png 182w, https:\/\/www.kadencewp.com\/help-center\/wp-content\/uploads\/sites\/14\/2020\/11\/Screenshot-2025-10-16-at-10.04.20-AM-311x512.png 311w\" sizes=\"auto, (max-width: 620px) 100vw, 620px\" \/><\/figure>\n<\/div><\/div>\n\n<\/div><\/div>\n\n<style>.wp-block-kadence-advancedheading.kt-adv-heading941_84dd61-24, .wp-block-kadence-advancedheading.kt-adv-heading941_84dd61-24[data-kb-block=\"kb-adv-heading941_84dd61-24\"]{font-style:normal;}.wp-block-kadence-advancedheading.kt-adv-heading941_84dd61-24 mark.kt-highlight, .wp-block-kadence-advancedheading.kt-adv-heading941_84dd61-24[data-kb-block=\"kb-adv-heading941_84dd61-24\"] mark.kt-highlight{font-style:normal;color:#f76a0c;-webkit-box-decoration-break:clone;box-decoration-break:clone;padding-top:0px;padding-right:0px;padding-bottom:0px;padding-left:0px;}.wp-block-kadence-advancedheading.kt-adv-heading941_84dd61-24 img.kb-inline-image, .wp-block-kadence-advancedheading.kt-adv-heading941_84dd61-24[data-kb-block=\"kb-adv-heading941_84dd61-24\"] img.kb-inline-image{width:150px;vertical-align:baseline;}<\/style>\n<h2 id=\"customizing-the-trigger-block\" class=\"kt-adv-heading941_84dd61-24 wp-block-kadence-advancedheading\" data-kb-block=\"kb-adv-heading941_84dd61-24\">Customizing the Trigger Block<\/h2>\n\n\n<style>.kb-row-layout-id941_1595cc-e6 > .kt-row-column-wrap{align-content:start;}:where(.kb-row-layout-id941_1595cc-e6 > .kt-row-column-wrap) > .wp-block-kadence-column{justify-content:start;}.kb-row-layout-id941_1595cc-e6 > .kt-row-column-wrap{column-gap:var(--global-kb-gap-md, 2rem);row-gap:var(--global-kb-gap-md, 2rem);padding-top:var(--global-kb-spacing-sm, 1.5rem);padding-bottom:var(--global-kb-spacing-sm, 1.5rem);grid-template-columns:minmax(0, 2fr) minmax(0, 1fr);}.kb-row-layout-id941_1595cc-e6 > .kt-row-layout-overlay{opacity:0.30;}@media all and (max-width: 1024px){.kb-row-layout-id941_1595cc-e6 > .kt-row-column-wrap{grid-template-columns:minmax(0, 2fr) minmax(0, 1fr);}}@media all and (max-width: 767px){.kb-row-layout-id941_1595cc-e6 > .kt-row-column-wrap{grid-template-columns:minmax(0, 1fr);}}<\/style><div class=\"kb-row-layout-wrap kb-row-layout-id941_1595cc-e6 alignnone wp-block-kadence-rowlayout\"><div class=\"kt-row-column-wrap kt-has-2-columns kt-row-layout-left-golden kt-tab-layout-inherit kt-mobile-layout-row kt-row-valign-top\">\n<style>.kadence-column941_eeef39-92 > .kt-inside-inner-col,.kadence-column941_eeef39-92 > .kt-inside-inner-col:before{border-top-left-radius:0px;border-top-right-radius:0px;border-bottom-right-radius:0px;border-bottom-left-radius:0px;}.kadence-column941_eeef39-92 > .kt-inside-inner-col{column-gap:var(--global-kb-gap-sm, 1rem);}.kadence-column941_eeef39-92 > .kt-inside-inner-col{flex-direction:column;}.kadence-column941_eeef39-92 > .kt-inside-inner-col > .aligncenter{width:100%;}.kadence-column941_eeef39-92 > .kt-inside-inner-col:before{opacity:0.3;}.kadence-column941_eeef39-92{position:relative;}@media all and (max-width: 1024px){.kadence-column941_eeef39-92 > .kt-inside-inner-col{flex-direction:column;justify-content:center;}}@media all and (max-width: 767px){.kadence-column941_eeef39-92 > .kt-inside-inner-col{flex-direction:column;justify-content:center;}}<\/style>\n<div class=\"wp-block-kadence-column kadence-column941_eeef39-92\"><div class=\"kt-inside-inner-col\">\n<p>To customize the settings for the trigger, click the gear icon in the Trigger block header. This will open the settings panel for the block.<\/p>\n<\/div><\/div>\n\n\n<style>.kadence-column941_271eee-70 > .kt-inside-inner-col,.kadence-column941_271eee-70 > .kt-inside-inner-col:before{border-top-left-radius:0px;border-top-right-radius:0px;border-bottom-right-radius:0px;border-bottom-left-radius:0px;}.kadence-column941_271eee-70 > .kt-inside-inner-col{column-gap:var(--global-kb-gap-sm, 1rem);}.kadence-column941_271eee-70 > .kt-inside-inner-col{flex-direction:column;}.kadence-column941_271eee-70 > .kt-inside-inner-col > .aligncenter{width:100%;}.kadence-column941_271eee-70 > .kt-inside-inner-col:before{opacity:0.3;}.kadence-column941_271eee-70{position:relative;}@media all and (max-width: 1024px){.kadence-column941_271eee-70 > .kt-inside-inner-col{flex-direction:column;justify-content:center;}}@media all and (max-width: 767px){.kadence-column941_271eee-70 > .kt-inside-inner-col{flex-direction:column;justify-content:center;}}<\/style>\n<div class=\"wp-block-kadence-column kadence-column941_271eee-70\"><div class=\"kt-inside-inner-col\"><style>.kb-image941_700173-b4 .kb-image-has-overlay:after{opacity:0.3;}<\/style>\n<figure class=\"wp-block-kadence-image kb-image941_700173-b4 size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"608\" height=\"254\" src=\"https:\/\/www.kadencewp.com\/help-center\/wp-content\/uploads\/sites\/14\/2020\/11\/Screenshot-2025-10-16-at-10.32.37-AM.png\" alt=\"Trigger Block - Customize Icon\" class=\"kb-img wp-image-15666\" srcset=\"https:\/\/www.kadencewp.com\/help-center\/wp-content\/uploads\/sites\/14\/2020\/11\/Screenshot-2025-10-16-at-10.32.37-AM.png 608w, https:\/\/www.kadencewp.com\/help-center\/wp-content\/uploads\/sites\/14\/2020\/11\/Screenshot-2025-10-16-at-10.32.37-AM-300x125.png 300w, https:\/\/www.kadencewp.com\/help-center\/wp-content\/uploads\/sites\/14\/2020\/11\/Screenshot-2025-10-16-at-10.32.37-AM-360x150.png 360w\" sizes=\"auto, (max-width: 608px) 100vw, 608px\" \/><\/figure>\n<\/div><\/div>\n\n<\/div><\/div>\n\n<style>.wp-block-kadence-advancedheading.kt-adv-heading941_7b6c0c-5f, .wp-block-kadence-advancedheading.kt-adv-heading941_7b6c0c-5f[data-kb-block=\"kb-adv-heading941_7b6c0c-5f\"]{font-style:normal;}.wp-block-kadence-advancedheading.kt-adv-heading941_7b6c0c-5f mark.kt-highlight, .wp-block-kadence-advancedheading.kt-adv-heading941_7b6c0c-5f[data-kb-block=\"kb-adv-heading941_7b6c0c-5f\"] mark.kt-highlight{font-style:normal;color:#f76a0c;-webkit-box-decoration-break:clone;box-decoration-break:clone;padding-top:0px;padding-right:0px;padding-bottom:0px;padding-left:0px;}.wp-block-kadence-advancedheading.kt-adv-heading941_7b6c0c-5f img.kb-inline-image, .wp-block-kadence-advancedheading.kt-adv-heading941_7b6c0c-5f[data-kb-block=\"kb-adv-heading941_7b6c0c-5f\"] img.kb-inline-image{width:150px;vertical-align:baseline;}<\/style>\n<h3 id=\"trigger-general-settings\" class=\"kt-adv-heading941_7b6c0c-5f wp-block-kadence-advancedheading\" data-kb-block=\"kb-adv-heading941_7b6c0c-5f\">Trigger &#8211; General Settings<\/h3>\n\n\n<style>.kb-row-layout-id941_b94ff8-77 > .kt-row-column-wrap{align-content:start;}:where(.kb-row-layout-id941_b94ff8-77 > .kt-row-column-wrap) > .wp-block-kadence-column{justify-content:start;}.kb-row-layout-id941_b94ff8-77 > .kt-row-column-wrap{column-gap:var(--global-kb-gap-md, 2rem);row-gap:var(--global-kb-gap-md, 2rem);padding-top:var(--global-kb-spacing-sm, 1.5rem);padding-bottom:var(--global-kb-spacing-sm, 1.5rem);grid-template-columns:minmax(0, 2fr) minmax(0, 1fr);}.kb-row-layout-id941_b94ff8-77 > .kt-row-layout-overlay{opacity:0.30;}@media all and (max-width: 1024px){.kb-row-layout-id941_b94ff8-77 > .kt-row-column-wrap{grid-template-columns:minmax(0, 2fr) minmax(0, 1fr);}}@media all and (max-width: 767px){.kb-row-layout-id941_b94ff8-77 > .kt-row-column-wrap{grid-template-columns:minmax(0, 1fr);}}<\/style><div class=\"kb-row-layout-wrap kb-row-layout-id941_b94ff8-77 alignnone wp-block-kadence-rowlayout\"><div class=\"kt-row-column-wrap kt-has-2-columns kt-row-layout-left-golden kt-tab-layout-inherit kt-mobile-layout-row kt-row-valign-top\">\n<style>.kadence-column941_41e92a-2a > .kt-inside-inner-col,.kadence-column941_41e92a-2a > .kt-inside-inner-col:before{border-top-left-radius:0px;border-top-right-radius:0px;border-bottom-right-radius:0px;border-bottom-left-radius:0px;}.kadence-column941_41e92a-2a > .kt-inside-inner-col{column-gap:var(--global-kb-gap-sm, 1rem);}.kadence-column941_41e92a-2a > .kt-inside-inner-col{flex-direction:column;}.kadence-column941_41e92a-2a > .kt-inside-inner-col > .aligncenter{width:100%;}.kadence-column941_41e92a-2a > .kt-inside-inner-col:before{opacity:0.3;}.kadence-column941_41e92a-2a{position:relative;}@media all and (max-width: 1024px){.kadence-column941_41e92a-2a > .kt-inside-inner-col{flex-direction:column;justify-content:center;}}@media all and (max-width: 767px){.kadence-column941_41e92a-2a > .kt-inside-inner-col{flex-direction:column;justify-content:center;}}<\/style>\n<div class=\"wp-block-kadence-column kadence-column941_41e92a-2a\"><div class=\"kt-inside-inner-col\">\n<p><strong>Menu Label<\/strong> &#8211; The Menu Label allows you to add text before the mobile trigger. For example, you might add &#8220;MENU&#8221;.<\/p>\n\n\n\n<p><strong>Trigger Icon<\/strong> &#8211; choose from one of three options for the trigger icon.<\/p>\n\n\n\n<p><strong>Drawer Container Options<\/strong> &#8211; this links to the Off Canvas settings. See <a href=\"#customizing-the-off-canvas-area\">Customizing the Off Canvas Area<\/a> below for details.<\/p>\n<\/div><\/div>\n\n\n<style>.kadence-column941_f7f64c-66 > .kt-inside-inner-col,.kadence-column941_f7f64c-66 > .kt-inside-inner-col:before{border-top-left-radius:0px;border-top-right-radius:0px;border-bottom-right-radius:0px;border-bottom-left-radius:0px;}.kadence-column941_f7f64c-66 > .kt-inside-inner-col{column-gap:var(--global-kb-gap-sm, 1rem);}.kadence-column941_f7f64c-66 > .kt-inside-inner-col{flex-direction:column;}.kadence-column941_f7f64c-66 > .kt-inside-inner-col > .aligncenter{width:100%;}.kadence-column941_f7f64c-66 > .kt-inside-inner-col:before{opacity:0.3;}.kadence-column941_f7f64c-66{position:relative;}@media all and (max-width: 1024px){.kadence-column941_f7f64c-66 > .kt-inside-inner-col{flex-direction:column;justify-content:center;}}@media all and (max-width: 767px){.kadence-column941_f7f64c-66 > .kt-inside-inner-col{flex-direction:column;justify-content:center;}}<\/style>\n<div class=\"wp-block-kadence-column kadence-column941_f7f64c-66\"><div class=\"kt-inside-inner-col\"><style>.kb-image941_8b9ba1-00 .kb-image-has-overlay:after{opacity:0.3;}<\/style>\n<figure class=\"wp-block-kadence-image kb-image941_8b9ba1-00 size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"622\" height=\"952\" src=\"https:\/\/www.kadencewp.com\/help-center\/wp-content\/uploads\/sites\/14\/2020\/11\/Screenshot-2025-10-16-at-10.36.10-AM.png\" alt=\"Mobile Trigger - General Settings\" class=\"kb-img wp-image-15667\" srcset=\"https:\/\/www.kadencewp.com\/help-center\/wp-content\/uploads\/sites\/14\/2020\/11\/Screenshot-2025-10-16-at-10.36.10-AM.png 622w, https:\/\/www.kadencewp.com\/help-center\/wp-content\/uploads\/sites\/14\/2020\/11\/Screenshot-2025-10-16-at-10.36.10-AM-196x300.png 196w, https:\/\/www.kadencewp.com\/help-center\/wp-content\/uploads\/sites\/14\/2020\/11\/Screenshot-2025-10-16-at-10.36.10-AM-335x512.png 335w\" sizes=\"auto, (max-width: 622px) 100vw, 622px\" \/><\/figure>\n<\/div><\/div>\n\n<\/div><\/div>\n\n<style>.wp-block-kadence-advancedheading.kt-adv-heading941_be882b-73, .wp-block-kadence-advancedheading.kt-adv-heading941_be882b-73[data-kb-block=\"kb-adv-heading941_be882b-73\"]{font-style:normal;}.wp-block-kadence-advancedheading.kt-adv-heading941_be882b-73 mark.kt-highlight, .wp-block-kadence-advancedheading.kt-adv-heading941_be882b-73[data-kb-block=\"kb-adv-heading941_be882b-73\"] mark.kt-highlight{font-style:normal;color:#f76a0c;-webkit-box-decoration-break:clone;box-decoration-break:clone;padding-top:0px;padding-right:0px;padding-bottom:0px;padding-left:0px;}.wp-block-kadence-advancedheading.kt-adv-heading941_be882b-73 img.kb-inline-image, .wp-block-kadence-advancedheading.kt-adv-heading941_be882b-73[data-kb-block=\"kb-adv-heading941_be882b-73\"] img.kb-inline-image{width:150px;vertical-align:baseline;}<\/style>\n<h3 id=\"trigger-design-settings\" class=\"kt-adv-heading941_be882b-73 wp-block-kadence-advancedheading\" data-kb-block=\"kb-adv-heading941_be882b-73\">Trigger &#8211; Design Settings<\/h3>\n\n\n<style>.kb-row-layout-id941_509f62-8b > .kt-row-column-wrap{align-content:start;}:where(.kb-row-layout-id941_509f62-8b > .kt-row-column-wrap) > .wp-block-kadence-column{justify-content:start;}.kb-row-layout-id941_509f62-8b > .kt-row-column-wrap{column-gap:var(--global-kb-gap-md, 2rem);row-gap:var(--global-kb-gap-md, 2rem);padding-top:var(--global-kb-spacing-sm, 1.5rem);padding-bottom:var(--global-kb-spacing-sm, 1.5rem);grid-template-columns:minmax(0, 2fr) minmax(0, 1fr);}.kb-row-layout-id941_509f62-8b > .kt-row-layout-overlay{opacity:0.30;}@media all and (max-width: 1024px){.kb-row-layout-id941_509f62-8b > .kt-row-column-wrap{grid-template-columns:minmax(0, 2fr) minmax(0, 1fr);}}@media all and (max-width: 767px){.kb-row-layout-id941_509f62-8b > .kt-row-column-wrap{grid-template-columns:minmax(0, 1fr);}}<\/style><div class=\"kb-row-layout-wrap kb-row-layout-id941_509f62-8b alignnone wp-block-kadence-rowlayout\"><div class=\"kt-row-column-wrap kt-has-2-columns kt-row-layout-left-golden kt-tab-layout-inherit kt-mobile-layout-row kt-row-valign-top\">\n<style>.kadence-column941_16a869-04 > .kt-inside-inner-col,.kadence-column941_16a869-04 > .kt-inside-inner-col:before{border-top-left-radius:0px;border-top-right-radius:0px;border-bottom-right-radius:0px;border-bottom-left-radius:0px;}.kadence-column941_16a869-04 > .kt-inside-inner-col{column-gap:var(--global-kb-gap-sm, 1rem);}.kadence-column941_16a869-04 > .kt-inside-inner-col{flex-direction:column;}.kadence-column941_16a869-04 > .kt-inside-inner-col > .aligncenter{width:100%;}.kadence-column941_16a869-04 > .kt-inside-inner-col:before{opacity:0.3;}.kadence-column941_16a869-04{position:relative;}@media all and (max-width: 1024px){.kadence-column941_16a869-04 > .kt-inside-inner-col{flex-direction:column;justify-content:center;}}@media all and (max-width: 767px){.kadence-column941_16a869-04 > .kt-inside-inner-col{flex-direction:column;justify-content:center;}}<\/style>\n<div class=\"wp-block-kadence-column kadence-column941_16a869-04\"><div class=\"kt-inside-inner-col\">\n<p><strong>Trigger Style<\/strong> &#8211; Choose <strong>Default<\/strong> (no border) or <strong>Bordered<\/strong>.<\/p>\n\n\n\n<p><strong>Trigger Border<\/strong> &#8211; if <em>Bordered<\/em> style is selected, choose the width and style of the trigger border.<\/p>\n\n\n\n<p><strong>Icon Size<\/strong> &#8211; choose the size and unit of measure for the trigger icon.<\/p>\n\n\n\n<p><strong>Trigger Colors<\/strong> &#8211; Select the Initial and Hover\/Active color for the trigger icon.<\/p>\n\n\n\n<p><strong>Trigger Background<\/strong> &#8211; Select the Initial and Hover\/Active background color for the trigger icon.<\/p>\n\n\n\n<p><strong>Trigger Padding<\/strong> &#8211; Set the padding around the trigger icon.  If you selected the Bordered style, this padding will appear inside the borders.<\/p>\n<\/div><\/div>\n\n\n<style>.kadence-column941_e7cbf7-a5 > .kt-inside-inner-col,.kadence-column941_e7cbf7-a5 > .kt-inside-inner-col:before{border-top-left-radius:0px;border-top-right-radius:0px;border-bottom-right-radius:0px;border-bottom-left-radius:0px;}.kadence-column941_e7cbf7-a5 > .kt-inside-inner-col{column-gap:var(--global-kb-gap-sm, 1rem);}.kadence-column941_e7cbf7-a5 > .kt-inside-inner-col{flex-direction:column;}.kadence-column941_e7cbf7-a5 > .kt-inside-inner-col > .aligncenter{width:100%;}.kadence-column941_e7cbf7-a5 > .kt-inside-inner-col:before{opacity:0.3;}.kadence-column941_e7cbf7-a5{position:relative;}@media all and (max-width: 1024px){.kadence-column941_e7cbf7-a5 > .kt-inside-inner-col{flex-direction:column;justify-content:center;}}@media all and (max-width: 767px){.kadence-column941_e7cbf7-a5 > .kt-inside-inner-col{flex-direction:column;justify-content:center;}}<\/style>\n<div class=\"wp-block-kadence-column kadence-column941_e7cbf7-a5\"><div class=\"kt-inside-inner-col\"><style>.kb-image941_ef0de3-65 .kb-image-has-overlay:after{opacity:0.3;}<\/style>\n<figure class=\"wp-block-kadence-image kb-image941_ef0de3-65 size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"618\" height=\"1470\" src=\"https:\/\/www.kadencewp.com\/help-center\/wp-content\/uploads\/sites\/14\/2020\/11\/Screenshot-2025-10-16-at-10.42.04-AM.png\" alt=\"Mobile Trigger - Design Settings\" class=\"kb-img wp-image-15669\" srcset=\"https:\/\/www.kadencewp.com\/help-center\/wp-content\/uploads\/sites\/14\/2020\/11\/Screenshot-2025-10-16-at-10.42.04-AM.png 618w, https:\/\/www.kadencewp.com\/help-center\/wp-content\/uploads\/sites\/14\/2020\/11\/Screenshot-2025-10-16-at-10.42.04-AM-126x300.png 126w, https:\/\/www.kadencewp.com\/help-center\/wp-content\/uploads\/sites\/14\/2020\/11\/Screenshot-2025-10-16-at-10.42.04-AM-430x1024.png 430w, https:\/\/www.kadencewp.com\/help-center\/wp-content\/uploads\/sites\/14\/2020\/11\/Screenshot-2025-10-16-at-10.42.04-AM-215x512.png 215w\" sizes=\"auto, (max-width: 618px) 100vw, 618px\" \/><\/figure>\n<\/div><\/div>\n\n<\/div><\/div>\n\n<style>.wp-block-kadence-advancedheading.kt-adv-heading941_c4ee77-df, .wp-block-kadence-advancedheading.kt-adv-heading941_c4ee77-df[data-kb-block=\"kb-adv-heading941_c4ee77-df\"]{font-style:normal;}.wp-block-kadence-advancedheading.kt-adv-heading941_c4ee77-df mark.kt-highlight, .wp-block-kadence-advancedheading.kt-adv-heading941_c4ee77-df[data-kb-block=\"kb-adv-heading941_c4ee77-df\"] mark.kt-highlight{font-style:normal;color:#f76a0c;-webkit-box-decoration-break:clone;box-decoration-break:clone;padding-top:0px;padding-right:0px;padding-bottom:0px;padding-left:0px;}.wp-block-kadence-advancedheading.kt-adv-heading941_c4ee77-df img.kb-inline-image, .wp-block-kadence-advancedheading.kt-adv-heading941_c4ee77-df[data-kb-block=\"kb-adv-heading941_c4ee77-df\"] img.kb-inline-image{width:150px;vertical-align:baseline;}<\/style>\n<h2 id=\"customizing-the-off-canvas-area\" class=\"kt-adv-heading941_c4ee77-df wp-block-kadence-advancedheading\" data-kb-block=\"kb-adv-heading941_c4ee77-df\">Customizing the Off Canvas Area<\/h2>\n\n\n<style>.kb-row-layout-id941_d2afdd-cd > .kt-row-column-wrap{align-content:start;}:where(.kb-row-layout-id941_d2afdd-cd > .kt-row-column-wrap) > .wp-block-kadence-column{justify-content:start;}.kb-row-layout-id941_d2afdd-cd > .kt-row-column-wrap{column-gap:var(--global-kb-gap-md, 2rem);row-gap:var(--global-kb-gap-md, 2rem);padding-top:var(--global-kb-spacing-sm, 1.5rem);padding-bottom:var(--global-kb-spacing-sm, 1.5rem);grid-template-columns:minmax(0, 2fr) minmax(0, 1fr);}.kb-row-layout-id941_d2afdd-cd > .kt-row-layout-overlay{opacity:0.30;}@media all and (max-width: 1024px){.kb-row-layout-id941_d2afdd-cd > .kt-row-column-wrap{grid-template-columns:minmax(0, 2fr) minmax(0, 1fr);}}@media all and (max-width: 767px){.kb-row-layout-id941_d2afdd-cd > .kt-row-column-wrap{grid-template-columns:minmax(0, 1fr);}}<\/style><div class=\"kb-row-layout-wrap kb-row-layout-id941_d2afdd-cd alignnone wp-block-kadence-rowlayout\"><div class=\"kt-row-column-wrap kt-has-2-columns kt-row-layout-left-golden kt-tab-layout-inherit kt-mobile-layout-row kt-row-valign-top\">\n<style>.kadence-column941_f93a17-a7 > .kt-inside-inner-col,.kadence-column941_f93a17-a7 > .kt-inside-inner-col:before{border-top-left-radius:0px;border-top-right-radius:0px;border-bottom-right-radius:0px;border-bottom-left-radius:0px;}.kadence-column941_f93a17-a7 > .kt-inside-inner-col{column-gap:var(--global-kb-gap-sm, 1rem);}.kadence-column941_f93a17-a7 > .kt-inside-inner-col{flex-direction:column;}.kadence-column941_f93a17-a7 > .kt-inside-inner-col > .aligncenter{width:100%;}.kadence-column941_f93a17-a7 > .kt-inside-inner-col:before{opacity:0.3;}.kadence-column941_f93a17-a7{position:relative;}@media all and (max-width: 1024px){.kadence-column941_f93a17-a7 > .kt-inside-inner-col{flex-direction:column;justify-content:center;}}@media all and (max-width: 767px){.kadence-column941_f93a17-a7 > .kt-inside-inner-col{flex-direction:column;justify-content:center;}}<\/style>\n<div class=\"wp-block-kadence-column kadence-column941_f93a17-a7\"><div class=\"kt-inside-inner-col\">\n<p>To customize the settings for the Off Canvas area, click the gear icon in the Off Canvas header. This will open the settings panel for the off canvas area.<\/p>\n<\/div><\/div>\n\n\n<style>.kadence-column941_0e57b9-28 > .kt-inside-inner-col,.kadence-column941_0e57b9-28 > .kt-inside-inner-col:before{border-top-left-radius:0px;border-top-right-radius:0px;border-bottom-right-radius:0px;border-bottom-left-radius:0px;}.kadence-column941_0e57b9-28 > .kt-inside-inner-col{column-gap:var(--global-kb-gap-sm, 1rem);}.kadence-column941_0e57b9-28 > .kt-inside-inner-col{flex-direction:column;}.kadence-column941_0e57b9-28 > .kt-inside-inner-col > .aligncenter{width:100%;}.kadence-column941_0e57b9-28 > .kt-inside-inner-col:before{opacity:0.3;}.kadence-column941_0e57b9-28{position:relative;}@media all and (max-width: 1024px){.kadence-column941_0e57b9-28 > .kt-inside-inner-col{flex-direction:column;justify-content:center;}}@media all and (max-width: 767px){.kadence-column941_0e57b9-28 > .kt-inside-inner-col{flex-direction:column;justify-content:center;}}<\/style>\n<div class=\"wp-block-kadence-column kadence-column941_0e57b9-28\"><div class=\"kt-inside-inner-col\"><style>.kb-image941_f9c7d0-c2 .kb-image-has-overlay:after{opacity:0.3;}<\/style>\n<figure class=\"wp-block-kadence-image kb-image941_f9c7d0-c2 size-full is-resized\"><img decoding=\"async\" src=\"https:\/\/www.kadencewp.com\/kadence-theme\/wp-content\/uploads\/sites\/10\/2020\/11\/mobile_off_canvas_settings.jpg\" alt=\"Off Canvas Settings Icon\" class=\"kb-img wp-image-944\" width=\"372px\" height=\"256px\" \/><\/figure>\n<\/div><\/div>\n\n<\/div><\/div>\n\n<style>.wp-block-kadence-advancedheading.kt-adv-heading941_ad45f7-fe, .wp-block-kadence-advancedheading.kt-adv-heading941_ad45f7-fe[data-kb-block=\"kb-adv-heading941_ad45f7-fe\"]{font-style:normal;}.wp-block-kadence-advancedheading.kt-adv-heading941_ad45f7-fe mark.kt-highlight, .wp-block-kadence-advancedheading.kt-adv-heading941_ad45f7-fe[data-kb-block=\"kb-adv-heading941_ad45f7-fe\"] mark.kt-highlight{font-style:normal;color:#f76a0c;-webkit-box-decoration-break:clone;box-decoration-break:clone;padding-top:0px;padding-right:0px;padding-bottom:0px;padding-left:0px;}.wp-block-kadence-advancedheading.kt-adv-heading941_ad45f7-fe img.kb-inline-image, .wp-block-kadence-advancedheading.kt-adv-heading941_ad45f7-fe[data-kb-block=\"kb-adv-heading941_ad45f7-fe\"] img.kb-inline-image{width:150px;vertical-align:baseline;}<\/style>\n<h3 id=\"off-canvas-general-settings\" class=\"kt-adv-heading941_ad45f7-fe wp-block-kadence-advancedheading\" data-kb-block=\"kb-adv-heading941_ad45f7-fe\">Off Canvas &#8211; General Settings<\/h3>\n\n\n<style>.kb-row-layout-id941_896c5e-b6 > .kt-row-column-wrap{align-content:start;}:where(.kb-row-layout-id941_896c5e-b6 > .kt-row-column-wrap) > .wp-block-kadence-column{justify-content:start;}.kb-row-layout-id941_896c5e-b6 > .kt-row-column-wrap{column-gap:var(--global-kb-gap-md, 2rem);row-gap:var(--global-kb-gap-md, 2rem);padding-top:var(--global-kb-spacing-sm, 1.5rem);padding-bottom:var(--global-kb-spacing-sm, 1.5rem);grid-template-columns:minmax(0, 2fr) minmax(0, 1fr);}.kb-row-layout-id941_896c5e-b6 > .kt-row-layout-overlay{opacity:0.30;}@media all and (max-width: 1024px){.kb-row-layout-id941_896c5e-b6 > .kt-row-column-wrap{grid-template-columns:minmax(0, 2fr) minmax(0, 1fr);}}@media all and (max-width: 767px){.kb-row-layout-id941_896c5e-b6 > .kt-row-column-wrap{grid-template-columns:minmax(0, 1fr);}}<\/style><div class=\"kb-row-layout-wrap kb-row-layout-id941_896c5e-b6 alignnone wp-block-kadence-rowlayout\"><div class=\"kt-row-column-wrap kt-has-2-columns kt-row-layout-left-golden kt-tab-layout-inherit kt-mobile-layout-row kt-row-valign-top\">\n<style>.kadence-column941_c180e0-ef > .kt-inside-inner-col,.kadence-column941_c180e0-ef > .kt-inside-inner-col:before{border-top-left-radius:0px;border-top-right-radius:0px;border-bottom-right-radius:0px;border-bottom-left-radius:0px;}.kadence-column941_c180e0-ef > .kt-inside-inner-col{column-gap:var(--global-kb-gap-sm, 1rem);}.kadence-column941_c180e0-ef > .kt-inside-inner-col{flex-direction:column;}.kadence-column941_c180e0-ef > .kt-inside-inner-col > .aligncenter{width:100%;}.kadence-column941_c180e0-ef > .kt-inside-inner-col:before{opacity:0.3;}.kadence-column941_c180e0-ef{position:relative;}@media all and (max-width: 1024px){.kadence-column941_c180e0-ef > .kt-inside-inner-col{flex-direction:column;justify-content:center;}}@media all and (max-width: 767px){.kadence-column941_c180e0-ef > .kt-inside-inner-col{flex-direction:column;justify-content:center;}}<\/style>\n<div class=\"wp-block-kadence-column kadence-column941_c180e0-ef\"><div class=\"kt-inside-inner-col\">\n<p><strong>Layout<\/strong> &#8211; The Off Canvas area appears over the page content. Choose <strong>Fullwidth<\/strong> to completely fill the screen or <strong>Side Panel<\/strong> to partially cover the screen.<\/p>\n\n\n\n<p><strong>Animation (not shown)<\/strong> &#8211; When <em>Fullwidth<\/em> is selected, the animation can be set to <strong>Fade<\/strong>, <strong>Scale<\/strong>, or <strong>Slice<\/strong>.<\/p>\n\n\n\n<p><strong>Slide-Out Side<\/strong> &#8211; When <em>Side Panel<\/em> is selected, choose which side the menu will originate from (Left or Right).<\/p>\n\n\n\n<p><strong>Move Body with toggle?<\/strong> &#8211; When <em>Side Panel<\/em> is selected, this option will move the body (i.e. slide over) as the side panel appears.  Note: This can require a lot of memory to render and can impact mobile performance.<\/p>\n\n\n\n<p><strong>Panel Width<\/strong> &#8211; When <em>Side Panel<\/em> is selected, choose the width and unit of measure for the side panel.  Responsive settings are available.<\/p>\n\n\n\n<p><strong>Content Max Width<\/strong> &#8211; Set the Maximum width (size and unit of measure) of the content inside of the panel.  Responsive settings are available.<\/p>\n\n\n\n<p><strong>Content Align<\/strong> &#8211; Choose to align the content <strong>Left<\/strong>, <strong>Center<\/strong>, or <strong>Right<\/strong>.<\/p>\n\n\n\n<p><strong>Content Vertical Align<\/strong> &#8211; Choose to vertically align the content <strong>Top<\/strong>, <strong>Middle<\/strong>, or <strong>Bottom<\/strong>.<\/p>\n<\/div><\/div>\n\n\n<style>.kadence-column941_ab3932-cb > .kt-inside-inner-col{display:flex;}.kadence-column941_ab3932-cb > .kt-inside-inner-col,.kadence-column941_ab3932-cb > .kt-inside-inner-col:before{border-top-left-radius:0px;border-top-right-radius:0px;border-bottom-right-radius:0px;border-bottom-left-radius:0px;}.kadence-column941_ab3932-cb > .kt-inside-inner-col{row-gap:var(--global-kb-gap-none, 0rem );column-gap:var(--global-kb-gap-sm, 1rem);}.kadence-column941_ab3932-cb > .kt-inside-inner-col{flex-direction:column;}.kadence-column941_ab3932-cb > .kt-inside-inner-col > .aligncenter{width:100%;}.kadence-column941_ab3932-cb > .kt-inside-inner-col:before{opacity:0.3;}.kadence-column941_ab3932-cb{position:relative;}@media all and (max-width: 1024px){.kadence-column941_ab3932-cb > .kt-inside-inner-col{flex-direction:column;justify-content:center;}}@media all and (max-width: 767px){.kadence-column941_ab3932-cb > .kt-inside-inner-col{flex-direction:column;justify-content:center;}}<\/style>\n<div class=\"wp-block-kadence-column kadence-column941_ab3932-cb\"><div class=\"kt-inside-inner-col\"><style>.kb-image941_63c5d0-32 .kb-image-has-overlay:after{opacity:0.3;}<\/style>\n<figure class=\"wp-block-kadence-image kb-image941_63c5d0-32 size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"620\" height=\"1068\" src=\"https:\/\/www.kadencewp.com\/help-center\/wp-content\/uploads\/sites\/14\/2020\/11\/Screenshot-2025-10-16-at-10.53.48-AM.png\" alt=\"Off Canvas - General Settings - Part 1\" class=\"kb-img wp-image-15673\" srcset=\"https:\/\/www.kadencewp.com\/help-center\/wp-content\/uploads\/sites\/14\/2020\/11\/Screenshot-2025-10-16-at-10.53.48-AM.png 620w, https:\/\/www.kadencewp.com\/help-center\/wp-content\/uploads\/sites\/14\/2020\/11\/Screenshot-2025-10-16-at-10.53.48-AM-174x300.png 174w, https:\/\/www.kadencewp.com\/help-center\/wp-content\/uploads\/sites\/14\/2020\/11\/Screenshot-2025-10-16-at-10.53.48-AM-594x1024.png 594w, https:\/\/www.kadencewp.com\/help-center\/wp-content\/uploads\/sites\/14\/2020\/11\/Screenshot-2025-10-16-at-10.53.48-AM-297x512.png 297w\" sizes=\"auto, (max-width: 620px) 100vw, 620px\" \/><\/figure>\n\n\n<style>.kb-image941_46f0eb-9b .kb-image-has-overlay:after{opacity:0.3;}<\/style>\n<figure class=\"wp-block-kadence-image kb-image941_46f0eb-9b size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"620\" height=\"950\" src=\"https:\/\/www.kadencewp.com\/help-center\/wp-content\/uploads\/sites\/14\/2020\/11\/Screenshot-2025-10-16-at-10.54.03-AM.png\" alt=\"Off Canvas - General Settings - Part 2\" class=\"kb-img wp-image-15675\" srcset=\"https:\/\/www.kadencewp.com\/help-center\/wp-content\/uploads\/sites\/14\/2020\/11\/Screenshot-2025-10-16-at-10.54.03-AM.png 620w, https:\/\/www.kadencewp.com\/help-center\/wp-content\/uploads\/sites\/14\/2020\/11\/Screenshot-2025-10-16-at-10.54.03-AM-196x300.png 196w, https:\/\/www.kadencewp.com\/help-center\/wp-content\/uploads\/sites\/14\/2020\/11\/Screenshot-2025-10-16-at-10.54.03-AM-334x512.png 334w\" sizes=\"auto, (max-width: 620px) 100vw, 620px\" \/><\/figure>\n<\/div><\/div>\n\n<\/div><\/div>\n\n<style>.wp-block-kadence-advancedheading.kt-adv-heading941_ce246a-cc, .wp-block-kadence-advancedheading.kt-adv-heading941_ce246a-cc[data-kb-block=\"kb-adv-heading941_ce246a-cc\"]{font-style:normal;}.wp-block-kadence-advancedheading.kt-adv-heading941_ce246a-cc mark.kt-highlight, .wp-block-kadence-advancedheading.kt-adv-heading941_ce246a-cc[data-kb-block=\"kb-adv-heading941_ce246a-cc\"] mark.kt-highlight{font-style:normal;color:#f76a0c;-webkit-box-decoration-break:clone;box-decoration-break:clone;padding-top:0px;padding-right:0px;padding-bottom:0px;padding-left:0px;}.wp-block-kadence-advancedheading.kt-adv-heading941_ce246a-cc img.kb-inline-image, .wp-block-kadence-advancedheading.kt-adv-heading941_ce246a-cc[data-kb-block=\"kb-adv-heading941_ce246a-cc\"] img.kb-inline-image{width:150px;vertical-align:baseline;}<\/style>\n<h3 id=\"off-canvas-design-settings\" class=\"kt-adv-heading941_ce246a-cc wp-block-kadence-advancedheading\" data-kb-block=\"kb-adv-heading941_ce246a-cc\">Off Canvas &#8211; Design Settings<\/h3>\n\n\n<style>.kb-row-layout-id941_2fb007-de > .kt-row-column-wrap{align-content:start;}:where(.kb-row-layout-id941_2fb007-de > .kt-row-column-wrap) > .wp-block-kadence-column{justify-content:start;}.kb-row-layout-id941_2fb007-de > .kt-row-column-wrap{column-gap:var(--global-kb-gap-md, 2rem);row-gap:var(--global-kb-gap-md, 2rem);padding-top:var(--global-kb-spacing-sm, 1.5rem);padding-bottom:var(--global-kb-spacing-sm, 1.5rem);grid-template-columns:minmax(0, 2fr) minmax(0, 1fr);}.kb-row-layout-id941_2fb007-de > .kt-row-layout-overlay{opacity:0.30;}@media all and (max-width: 1024px){.kb-row-layout-id941_2fb007-de > .kt-row-column-wrap{grid-template-columns:minmax(0, 2fr) minmax(0, 1fr);}}@media all and (max-width: 767px){.kb-row-layout-id941_2fb007-de > .kt-row-column-wrap{grid-template-columns:minmax(0, 1fr);}}<\/style><div class=\"kb-row-layout-wrap kb-row-layout-id941_2fb007-de alignnone wp-block-kadence-rowlayout\"><div class=\"kt-row-column-wrap kt-has-2-columns kt-row-layout-left-golden kt-tab-layout-inherit kt-mobile-layout-row kt-row-valign-top\">\n<style>.kadence-column941_bfde3c-e0 > .kt-inside-inner-col,.kadence-column941_bfde3c-e0 > .kt-inside-inner-col:before{border-top-left-radius:0px;border-top-right-radius:0px;border-bottom-right-radius:0px;border-bottom-left-radius:0px;}.kadence-column941_bfde3c-e0 > .kt-inside-inner-col{column-gap:var(--global-kb-gap-sm, 1rem);}.kadence-column941_bfde3c-e0 > .kt-inside-inner-col{flex-direction:column;}.kadence-column941_bfde3c-e0 > .kt-inside-inner-col > .aligncenter{width:100%;}.kadence-column941_bfde3c-e0 > .kt-inside-inner-col:before{opacity:0.3;}.kadence-column941_bfde3c-e0{position:relative;}@media all and (max-width: 1024px){.kadence-column941_bfde3c-e0 > .kt-inside-inner-col{flex-direction:column;justify-content:center;}}@media all and (max-width: 767px){.kadence-column941_bfde3c-e0 > .kt-inside-inner-col{flex-direction:column;justify-content:center;}}<\/style>\n<div class=\"wp-block-kadence-column kadence-column941_bfde3c-e0\"><div class=\"kt-inside-inner-col\">\n<p><strong>Popup Background<\/strong> &#8211; Select the color of the off canvas background.<\/p>\n\n\n\n<p><strong>Close Icon Size<\/strong> &#8211; Set the size of the X close icon that appears on the top-right of the canvas.<\/p>\n\n\n\n<p><strong>Close Toggle Colors<\/strong> &#8211; Set the Initial and Hover\/Active colors for the close icon.<\/p>\n\n\n\n<p><strong>Close Toggle Background Colors<\/strong> &#8211; Set the Initial and Hover\/Active background colors for the close icon.<\/p>\n\n\n\n<p><strong>Close Icon Padding<\/strong> &#8211; Set the padding around the close icon.<\/p>\n<\/div><\/div>\n\n\n<style>.kadence-column941_327c68-fd > .kt-inside-inner-col,.kadence-column941_327c68-fd > .kt-inside-inner-col:before{border-top-left-radius:0px;border-top-right-radius:0px;border-bottom-right-radius:0px;border-bottom-left-radius:0px;}.kadence-column941_327c68-fd > .kt-inside-inner-col{column-gap:var(--global-kb-gap-sm, 1rem);}.kadence-column941_327c68-fd > .kt-inside-inner-col{flex-direction:column;}.kadence-column941_327c68-fd > .kt-inside-inner-col > .aligncenter{width:100%;}.kadence-column941_327c68-fd > .kt-inside-inner-col:before{opacity:0.3;}.kadence-column941_327c68-fd{position:relative;}@media all and (max-width: 1024px){.kadence-column941_327c68-fd > .kt-inside-inner-col{flex-direction:column;justify-content:center;}}@media all and (max-width: 767px){.kadence-column941_327c68-fd > .kt-inside-inner-col{flex-direction:column;justify-content:center;}}<\/style>\n<div class=\"wp-block-kadence-column kadence-column941_327c68-fd\"><div class=\"kt-inside-inner-col\"><style>.kb-image941_9289f2-73 .kb-image-has-overlay:after{opacity:0.3;}<\/style>\n<figure class=\"wp-block-kadence-image kb-image941_9289f2-73 size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"620\" height=\"1276\" src=\"https:\/\/www.kadencewp.com\/help-center\/wp-content\/uploads\/sites\/14\/2020\/11\/Screenshot-2025-10-16-at-11.13.17-AM.png\" alt=\"Off Canvas - Design Settings\" class=\"kb-img wp-image-15684\" srcset=\"https:\/\/www.kadencewp.com\/help-center\/wp-content\/uploads\/sites\/14\/2020\/11\/Screenshot-2025-10-16-at-11.13.17-AM.png 620w, https:\/\/www.kadencewp.com\/help-center\/wp-content\/uploads\/sites\/14\/2020\/11\/Screenshot-2025-10-16-at-11.13.17-AM-146x300.png 146w, https:\/\/www.kadencewp.com\/help-center\/wp-content\/uploads\/sites\/14\/2020\/11\/Screenshot-2025-10-16-at-11.13.17-AM-498x1024.png 498w, https:\/\/www.kadencewp.com\/help-center\/wp-content\/uploads\/sites\/14\/2020\/11\/Screenshot-2025-10-16-at-11.13.17-AM-249x512.png 249w\" sizes=\"auto, (max-width: 620px) 100vw, 620px\" \/><\/figure>\n<\/div><\/div>\n\n<\/div><\/div>\n\n<style>.wp-block-kadence-advancedheading.kt-adv-heading941_d65dd0-05, .wp-block-kadence-advancedheading.kt-adv-heading941_d65dd0-05[data-kb-block=\"kb-adv-heading941_d65dd0-05\"]{font-style:normal;}.wp-block-kadence-advancedheading.kt-adv-heading941_d65dd0-05 mark.kt-highlight, .wp-block-kadence-advancedheading.kt-adv-heading941_d65dd0-05[data-kb-block=\"kb-adv-heading941_d65dd0-05\"] mark.kt-highlight{font-style:normal;color:#f76a0c;-webkit-box-decoration-break:clone;box-decoration-break:clone;padding-top:0px;padding-right:0px;padding-bottom:0px;padding-left:0px;}.wp-block-kadence-advancedheading.kt-adv-heading941_d65dd0-05 img.kb-inline-image, .wp-block-kadence-advancedheading.kt-adv-heading941_d65dd0-05[data-kb-block=\"kb-adv-heading941_d65dd0-05\"] img.kb-inline-image{width:150px;vertical-align:baseline;}<\/style>\n<h2 class=\"kt-adv-heading941_d65dd0-05 wp-block-kadence-advancedheading\" data-kb-block=\"kb-adv-heading941_d65dd0-05\">Conclusion<\/h2>\n\n\n\n<p>Customizing the mobile navigation experience with Kadence is easy! With several design and layout options to choose from, you can customize your mobile experience to fit the design of your site. Don&#8217;t forget to click &#8220;Publish&#8221; in the Customizer when you&#8217;re all done designing your mobile navigation!<\/p>\n","protected":false},"excerpt":{"rendered":"<p>Kadence creates two separate and distinct headers for your site: one for Desktop and one for Tablet\/Mobile. In this guide, we&#8217;ll show you how to access and customize the Tablet\/Mobile navigation area. Navigate to Headers in the Customizer From the WP Admin menu, go to Appearance \u2192 Customizer and click on Header. From here, click&#8230;<\/p>\n","protected":false},"author":1265,"featured_media":0,"comment_status":"open","ping_status":"open","template":"","meta":{"_kad_blocks_custom_css":"","_kad_blocks_head_custom_js":"","_kad_blocks_body_custom_js":"","_kad_blocks_footer_custom_js":"","_kadence_starter_templates_imported_post":false,"_kad_post_transparent":"","_kad_post_title":"","_kad_post_layout":"","_kad_post_sidebar_id":"","_kad_post_content_style":"","_kad_post_vertical_padding":"","_kad_post_feature":"","_kad_post_feature_position":"","_kad_post_header":false,"_kad_post_footer":false,"_kad_post_classname":"","footnotes":""},"doc_category":[407],"doc_tag":[],"knowledge_base":[6],"class_list":["post-941","docs","type-docs","status-publish","hentry","doc_category-theme-header","knowledge_base-kadence-theme"],"year_month":"2026-04","word_count":1019,"total_views":"15876","reactions":{"happy":"5","normal":"0","sad":"5"},"author_info":{"display_name":"Ben Ritner","author_link":"https:\/\/www.kadencewp.com\/help-center\/author\/britner\/"},"doc_category_info":[{"term_name":"Header","term_url":"https:\/\/www.kadencewp.com\/help-center\/knowledge-base\/kadence-theme\/theme-header\/"}],"doc_tag_info":[],"knowledge_base_info":[{"term_name":"Kadence Theme","term_url":"https:\/\/www.kadencewp.com\/help-center\/knowledge-base\/kadence-theme\/","term_slug":"kadence-theme"}],"knowledge_base_slug":["kadence-theme"],"taxonomy_info":{"doc_category":[{"value":407,"label":"Header"}],"knowledge_base":[{"value":6,"label":"Kadence Theme"}]},"featured_image_src_large":false,"comment_info":0,"_links":{"self":[{"href":"https:\/\/www.kadencewp.com\/help-center\/wp-json\/wp\/v2\/docs\/941","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.kadencewp.com\/help-center\/wp-json\/wp\/v2\/docs"}],"about":[{"href":"https:\/\/www.kadencewp.com\/help-center\/wp-json\/wp\/v2\/types\/docs"}],"author":[{"embeddable":true,"href":"https:\/\/www.kadencewp.com\/help-center\/wp-json\/wp\/v2\/users\/1265"}],"replies":[{"embeddable":true,"href":"https:\/\/www.kadencewp.com\/help-center\/wp-json\/wp\/v2\/comments?post=941"}],"version-history":[{"count":14,"href":"https:\/\/www.kadencewp.com\/help-center\/wp-json\/wp\/v2\/docs\/941\/revisions"}],"predecessor-version":[{"id":16568,"href":"https:\/\/www.kadencewp.com\/help-center\/wp-json\/wp\/v2\/docs\/941\/revisions\/16568"}],"wp:attachment":[{"href":"https:\/\/www.kadencewp.com\/help-center\/wp-json\/wp\/v2\/media?parent=941"}],"wp:term":[{"taxonomy":"doc_category","embeddable":true,"href":"https:\/\/www.kadencewp.com\/help-center\/wp-json\/wp\/v2\/doc_category?post=941"},{"taxonomy":"doc_tag","embeddable":true,"href":"https:\/\/www.kadencewp.com\/help-center\/wp-json\/wp\/v2\/doc_tag?post=941"},{"taxonomy":"knowledge_base","embeddable":true,"href":"https:\/\/www.kadencewp.com\/help-center\/wp-json\/wp\/v2\/knowledge_base?post=941"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}