{"id":13261,"date":"2025-06-12T05:05:20","date_gmt":"2025-06-12T05:05:20","guid":{"rendered":"https:\/\/www.kadencewp.com\/help-center\/?post_type=docs&#038;p=13261"},"modified":"2026-04-22T16:44:33","modified_gmt":"2026-04-22T16:44:33","password":"","slug":"control-the-hero-or-title-section-sitewide-and-per-page","status":"publish","type":"docs","link":"https:\/\/www.kadencewp.com\/help-center\/docs\/kadence-blocks\/control-the-hero-or-title-section-sitewide-and-per-page\/","title":{"rendered":"How to Control the Hero or Title Section Sitewide and Per Page in Kadence"},"content":{"rendered":"\n<p>The <strong>Hero Section<\/strong> (also called a <strong>Title Section<\/strong>) is the top part of your page that usually includes the page title, subtitle, background image or color, and layout styling. With the Kadence Theme, you have full flexibility to control this section globally across your site or customize it for individual pages and posts. You can even create completely custom designs using Kadence Blocks or Kadence Hooked Elements (Pro).<\/p>\n\n\n\n<p>This guide walks you through the different ways to control and design your Hero\/Title Sections depending on your needs.<\/p>\n\n\n\n<hr class=\"wp-block-separator has-alpha-channel-opacity\" \/>\n\n\n\n<h2 class=\"wp-block-heading\"><strong>1. Controlling Sitewide Hero\/Title Sections<\/strong><\/h2>\n\n\n\n<p>If you want to control the appearance of Hero\/Title Sections for all posts, pages, or archives across your site, the <strong>Customizer<\/strong> is the best place to start.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\"><strong>Using the Customizer<\/strong><\/h3>\n\n\n\n<p>Go to <strong>Appearance \u2192 Customize \u2192 Posts\/Pages Layout<\/strong>. Here, you\u2019ll find settings to enable or disable the built-in Title Section and adjust its appearance.<\/p>\n\n\n\n<p>You can:<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Show or hide the title section globally for posts, pages, and archives<\/li>\n\n\n\n<li>Set layout options such as alignment, spacing, and background color or image<\/li>\n\n\n\n<li>Customize typography and section padding<\/li>\n\n\n\n<li>Toggle the &#8220;<strong>Use Featured Image for Background?<\/strong>&#8221; option ON so the background image of the &#8220;Above Content&#8221; title sections will show different background images for each page.<\/li>\n<\/ul>\n\n\n\n<p>These changes apply globally, so all pages or posts of that type will follow the same styling.<\/p>\n\n\n\n<p><strong>Helpful guides:<\/strong><\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li><a href=\"https:\/\/www.kadencewp.com\/help-center\/docs\/kadence-theme\/single-post-layout-customizer-settings\" target=\"_blank\" rel=\"noreferrer noopener\">Customizing the Theme\u2019s built-in Post Title<\/a><\/li>\n\n\n\n<li><a href=\"https:\/\/www.kadencewp.com\/help-center\/docs\/kadence-theme\/page-layout-customizer-settings\" target=\"_blank\" rel=\"noreferrer noopener\">Customizing the Theme\u2019s built-in Page Title<\/a><\/li>\n<\/ul>\n\n\n\n<hr class=\"wp-block-separator has-alpha-channel-opacity\" \/>\n\n\n\n<h2 class=\"wp-block-heading\"><strong>2. Controlling Hero\/Title Sections for Individual Pages or Posts<\/strong><\/h2>\n\n\n\n<p>If you want to create unique Hero Sections for specific pages or posts, you can do that directly from the editor.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\"><strong>Step 1: Disable the Built-In Title Section<\/strong><\/h3>\n\n\n<style>.kb-row-layout-id13261_261532-c8 > .kt-row-column-wrap{align-content:start;}:where(.kb-row-layout-id13261_261532-c8 > .kt-row-column-wrap) > .wp-block-kadence-column{justify-content:start;}.kb-row-layout-id13261_261532-c8 > .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:repeat(2, minmax(0, 1fr));}.kb-row-layout-id13261_261532-c8 > .kt-row-layout-overlay{opacity:0.30;}@media all and (max-width: 1024px){.kb-row-layout-id13261_261532-c8 > .kt-row-column-wrap{grid-template-columns:repeat(2, minmax(0, 1fr));}}@media all and (max-width: 767px){.kb-row-layout-id13261_261532-c8 > .kt-row-column-wrap{grid-template-columns:minmax(0, 1fr);}}<\/style><div class=\"kb-row-layout-wrap kb-row-layout-id13261_261532-c8 alignnone wp-block-kadence-rowlayout\"><div class=\"kt-row-column-wrap kt-has-2-columns kt-row-layout-equal kt-tab-layout-inherit kt-mobile-layout-row kt-row-valign-top\">\n<style>.kadence-column13261_539c36-c8 > .kt-inside-inner-col,.kadence-column13261_539c36-c8 > .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-column13261_539c36-c8 > .kt-inside-inner-col{column-gap:var(--global-kb-gap-sm, 1rem);}.kadence-column13261_539c36-c8 > .kt-inside-inner-col{flex-direction:column;}.kadence-column13261_539c36-c8 > .kt-inside-inner-col > .aligncenter{width:100%;}.kadence-column13261_539c36-c8 > .kt-inside-inner-col:before{opacity:0.3;}.kadence-column13261_539c36-c8{position:relative;}@media all and (max-width: 1024px){.kadence-column13261_539c36-c8 > .kt-inside-inner-col{flex-direction:column;justify-content:center;}}@media all and (max-width: 767px){.kadence-column13261_539c36-c8 > .kt-inside-inner-col{flex-direction:column;justify-content:center;}}<\/style>\n<div class=\"wp-block-kadence-column kadence-column13261_539c36-c8\"><div class=\"kt-inside-inner-col\">\n<p>In the WordPress editor, open the <strong>Page Settings<\/strong> or <strong>Post Settings<\/strong> panel (usually on the right side).<br>Then set <strong>&#8220;Show Page Title&#8221;<\/strong> or <strong>&#8220;Show Post Title&#8221;<\/strong> to <strong>Disable<\/strong>.<\/p>\n\n\n\n<p><em>This removes the default title section so you can design your own.<\/em><\/p>\n<\/div><\/div>\n\n\n<style>.kadence-column13261_6fa65f-d9 > .kt-inside-inner-col,.kadence-column13261_6fa65f-d9 > .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-column13261_6fa65f-d9 > .kt-inside-inner-col{column-gap:var(--global-kb-gap-sm, 1rem);}.kadence-column13261_6fa65f-d9 > .kt-inside-inner-col{flex-direction:column;}.kadence-column13261_6fa65f-d9 > .kt-inside-inner-col > .aligncenter{width:100%;}.kadence-column13261_6fa65f-d9 > .kt-inside-inner-col:before{opacity:0.3;}.kadence-column13261_6fa65f-d9{position:relative;}@media all and (max-width: 1024px){.kadence-column13261_6fa65f-d9 > .kt-inside-inner-col{flex-direction:column;justify-content:center;}}@media all and (max-width: 767px){.kadence-column13261_6fa65f-d9 > .kt-inside-inner-col{flex-direction:column;justify-content:center;}}<\/style>\n<div class=\"wp-block-kadence-column kadence-column13261_6fa65f-d9\"><div class=\"kt-inside-inner-col\"><style>.kb-image13261_94e023-fc.kb-image-is-ratio-size, .kb-image13261_94e023-fc .kb-image-is-ratio-size{max-width:300px;width:100%;}.wp-block-kadence-column > .kt-inside-inner-col > .kb-image13261_94e023-fc.kb-image-is-ratio-size, .wp-block-kadence-column > .kt-inside-inner-col > .kb-image13261_94e023-fc .kb-image-is-ratio-size{align-self:unset;}.kb-image13261_94e023-fc figure{max-width:300px;}.kb-image13261_94e023-fc .image-is-svg, .kb-image13261_94e023-fc .image-is-svg img{width:100%;}.kb-image13261_94e023-fc .kb-image-has-overlay:after{opacity:0.3;}<\/style>\n<div class=\"wp-block-kadence-image kb-image13261_94e023-fc\"><figure class=\"aligncenter size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"433\" height=\"573\" src=\"https:\/\/www.kadencewp.com\/help-center\/wp-content\/uploads\/sites\/14\/2025\/06\/disable-title.jpg\" alt=\"\" class=\"kb-img wp-image-12979\" srcset=\"https:\/\/www.kadencewp.com\/help-center\/wp-content\/uploads\/sites\/14\/2025\/06\/disable-title.jpg 433w, https:\/\/www.kadencewp.com\/help-center\/wp-content\/uploads\/sites\/14\/2025\/06\/disable-title-227x300.jpg 227w, https:\/\/www.kadencewp.com\/help-center\/wp-content\/uploads\/sites\/14\/2025\/06\/disable-title-360x476.jpg 360w\" sizes=\"auto, (max-width: 433px) 100vw, 433px\" \/><\/figure><\/div>\n<\/div><\/div>\n\n<\/div><\/div>\n\n\n<h3 class=\"wp-block-heading\"><strong>Step 2: Create Your Custom Hero Section<\/strong><\/h3>\n\n\n\n<p>Use <strong>Kadence Blocks<\/strong> directly in the content editor to build your section.<\/p>\n\n\n<style>.kb-image13261_80ffeb-70.kb-image-is-ratio-size, .kb-image13261_80ffeb-70 .kb-image-is-ratio-size{max-width:700px;width:100%;}.wp-block-kadence-column > .kt-inside-inner-col > .kb-image13261_80ffeb-70.kb-image-is-ratio-size, .wp-block-kadence-column > .kt-inside-inner-col > .kb-image13261_80ffeb-70 .kb-image-is-ratio-size{align-self:unset;}.kb-image13261_80ffeb-70 figure{max-width:700px;}.kb-image13261_80ffeb-70 .image-is-svg, .kb-image13261_80ffeb-70 .image-is-svg img{width:100%;}.kb-image13261_80ffeb-70 .kb-image-has-overlay:after{opacity:0.3;}<\/style>\n<div class=\"wp-block-kadence-image kb-image13261_80ffeb-70\"><figure class=\"aligncenter size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"2046\" height=\"872\" src=\"https:\/\/www.kadencewp.com\/help-center\/wp-content\/uploads\/sites\/14\/2025\/06\/Custom-Title-Demo.gif\" alt=\"Custom Title Demo\" class=\"kb-img wp-image-13109\" \/><\/figure><\/div>\n\n\n<style>.kb-row-layout-id13261_b8b3b6-97 > .kt-row-column-wrap{align-content:start;}:where(.kb-row-layout-id13261_b8b3b6-97 > .kt-row-column-wrap) > .wp-block-kadence-column{justify-content:start;}.kb-row-layout-id13261_b8b3b6-97 > .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, 1fr);}.kb-row-layout-id13261_b8b3b6-97 > .kt-row-layout-overlay{opacity:0.30;}@media all and (max-width: 1024px){.kb-row-layout-id13261_b8b3b6-97 > .kt-row-column-wrap{grid-template-columns:minmax(0, 1fr);}}@media all and (max-width: 767px){.kb-row-layout-id13261_b8b3b6-97 > .kt-row-column-wrap{grid-template-columns:minmax(0, 1fr);}}<\/style><div class=\"kb-row-layout-wrap kb-row-layout-id13261_b8b3b6-97 alignnone has-theme-palette7-background-color kt-row-has-bg wp-block-kadence-rowlayout\"><div class=\"kt-row-column-wrap kt-has-1-columns kt-row-layout-equal kt-tab-layout-inherit kt-mobile-layout-row kt-row-valign-top\">\n<style>.kadence-column13261_bdc58f-0a > .kt-inside-inner-col,.kadence-column13261_bdc58f-0a > .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-column13261_bdc58f-0a > .kt-inside-inner-col{column-gap:var(--global-kb-gap-sm, 1rem);}.kadence-column13261_bdc58f-0a > .kt-inside-inner-col{flex-direction:column;}.kadence-column13261_bdc58f-0a > .kt-inside-inner-col > .aligncenter{width:100%;}.kadence-column13261_bdc58f-0a > .kt-inside-inner-col:before{opacity:0.3;}.kadence-column13261_bdc58f-0a{position:relative;}@media all and (max-width: 1024px){.kadence-column13261_bdc58f-0a > .kt-inside-inner-col{flex-direction:column;justify-content:center;}}@media all and (max-width: 767px){.kadence-column13261_bdc58f-0a > .kt-inside-inner-col{flex-direction:column;justify-content:center;}}<\/style>\n<div class=\"wp-block-kadence-column kadence-column13261_bdc58f-0a\"><div class=\"kt-inside-inner-col\">\n<p>Recommended blocks:<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li><strong>Row Layout<\/strong> \u2013 for flexible layouts and background options (images, colors, overlays)<\/li>\n\n\n\n<li><strong>Advanced Text<\/strong> \u2013 for styled titles, subtitles, and headings<\/li>\n<\/ul>\n\n\n\n<p>You can customize:<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Layout structure (columns, width, spacing)<\/li>\n\n\n\n<li>Background (image, color, overlay)<\/li>\n\n\n\n<li>Typography and alignment<\/li>\n\n\n\n<li>Visibility per device<\/li>\n<\/ul>\n\n\n\n<p>This method gives you complete control over the look and feel of the section on a page-by-page basis.<\/p>\n\n\n\n<blockquote class=\"wp-block-quote is-layout-flow wp-block-quote-is-layout-flow\">\n<p>\u26a0\ufe0f <strong>Note:<\/strong> This method only works for individual posts, pages, or custom post types. It does not apply to archive pages like categories or blog listings.<\/p>\n<\/blockquote>\n<\/div><\/div>\n\n<\/div><\/div>\n\n\n<hr class=\"wp-block-separator has-alpha-channel-opacity\" \/>\n\n\n\n<h2 class=\"wp-block-heading\"><strong>3. Creating Dynamic or Sitewide Hero Sections with Hooked Elements (Kadence Pro)<\/strong><\/h2>\n\n\n\n<p>For more advanced control, especially on archive pages or for inserting dynamic content, you can use <strong><a href=\"https:\/\/www.kadencewp.com\/help-center\/docs\/kadence-theme\/how-to-use-element-hooks\">Kadence Hooked Elements<\/a><\/strong>, available with the <strong><a href=\"https:\/\/www.kadencewp.com\/kadence-theme\/premium\">Kadence Theme Pro addon<\/a><\/strong>.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\"><strong>What Are Hooked Elements?<\/strong><\/h3>\n\n\n\n<p>Hooked Elements let you insert custom content in specific areas of your site by hooking into predefined positions in the theme layout. This works for:<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Pages<\/li>\n\n\n\n<li>Posts<\/li>\n\n\n\n<li>Archive pages (categories, tags, blog feed, etc.)<\/li>\n<\/ul>\n\n\n\n<h3 class=\"wp-block-heading\"><strong>Use Cases<\/strong><\/h3>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Replace the default Title Section with your own custom design<\/li>\n\n\n\n<li>Add additional content (like a subtitle or banner) above or below the default title<\/li>\n\n\n\n<li>Use <a href=\"https:\/\/www.kadencewp.com\/help-center\/docs\/kadence-blocks\/dynamic-content\/\">dynamic content<\/a> like post titles or featured images<\/li>\n<\/ul>\n\n\n\n<h3 class=\"wp-block-heading\"><strong>How to Create a Hooked Element<\/strong><\/h3>\n\n\n\n<p><br><br><img decoding=\"async\" src=\"https:\/\/www.kadencewp.com\/help-center\/wp-content\/uploads\/sites\/14\/2025\/06\/Creating-an-Element.gif\" alt=\"Creating an Element\"><br><\/p>\n\n\n\n<ol class=\"wp-block-list\">\n<li><strong>Go to<\/strong>: <strong>Appearance \u2192 Kadence \u2192 Elements \u2192 Add New<\/strong><\/li>\n\n\n\n<li>Choose <strong>Content Section<\/strong><\/li>\n\n\n\n<li>Add your design using Kadence Blocks<\/li>\n\n\n\n<li>Under <strong>Placement<\/strong>, choose where it should appear:\n<ul class=\"wp-block-list\">\n<li>Use <strong>&#8220;Replace Above Content Hero&#8221;<\/strong> to fully replace the default title section<\/li>\n\n\n\n<li>Or use <strong>insert options<\/strong> to place content above\/below the existing title<\/li>\n<\/ul>\n<\/li>\n\n\n\n<li>Set <strong>Display Settings<\/strong>:\n<ul class=\"wp-block-list\">\n<li>Choose where it shows (e.g., single post, all pages, archive)<\/li>\n\n\n\n<li>Optionally limit by device or user role<\/li>\n<\/ul>\n<\/li>\n<\/ol>\n\n\n\n<p>If you\u2019re using <strong><a href=\"https:\/\/www.kadencewp.com\/kadence-blocks\/pro\/\">Kadence Blocks Pro<\/a><\/strong>, you can also pull in <strong><a href=\"https:\/\/www.kadencewp.com\/help-center\/docs\/kadence-blocks\/dynamic-content\/\">Dynamic Content<\/a><\/strong>, such as:<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Post or page title<\/li>\n\n\n\n<li>Featured image<\/li>\n\n\n\n<li>Custom fields<\/li>\n<\/ul>\n\n\n\n<p>This method is ideal for consistent and dynamic layouts across your site.<\/p>\n\n\n\n<p><strong>References:<\/strong><\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li><a class=\"\" href=\"https:\/\/www.kadencewp.com\/help-center\/docs\/kadence-blocks\/dynamic-content\">Using Dynamic Content<\/a><\/li>\n\n\n\n<li><a class=\"\" href=\"https:\/\/www.kadencewp.com\/help-center\/docs\/kadence-theme\/how-to-use-element-hooks\">How to Use Element Hooks<\/a><\/li>\n\n\n\n<li><a class=\"\" href=\"https:\/\/www.kadencewp.com\/help-center\/docs\/kadence-theme\/how-to-create-a-kadence-elements-content-section\">Creating Content Elements<\/a><\/li>\n<\/ul>\n","protected":false},"excerpt":{"rendered":"<p>The Hero Section (also called a Title Section) is the top part of your page that usually includes the page title, subtitle, background image or color, and layout styling. With the Kadence Theme, you have full flexibility to control this section globally across your site or customize it for individual pages and posts. You can&#8230;<\/p>\n","protected":false},"author":130753,"featured_media":0,"comment_status":"open","ping_status":"closed","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":[417],"doc_tag":[],"knowledge_base":[7,6],"class_list":["post-13261","docs","type-docs","status-publish","hentry","doc_category-block-tutorials","knowledge_base-kadence-blocks","knowledge_base-kadence-theme"],"year_month":"2026-04","word_count":647,"total_views":"6460","reactions":{"happy":"0","normal":"0","sad":"0"},"author_info":{"display_name":"teejayhidalgo","author_link":"https:\/\/www.kadencewp.com\/help-center\/author\/teejayhidalgo\/"},"doc_category_info":[{"term_name":"Block Tutorials","term_url":"https:\/\/www.kadencewp.com\/help-center\/knowledge-base\/kadence-blocks\/block-tutorials\/"}],"doc_tag_info":[],"knowledge_base_info":[{"term_name":"Kadence Blocks","term_url":"https:\/\/www.kadencewp.com\/help-center\/knowledge-base\/kadence-blocks\/","term_slug":"kadence-blocks"},{"term_name":"Kadence Theme","term_url":"https:\/\/www.kadencewp.com\/help-center\/knowledge-base\/kadence-theme\/","term_slug":"kadence-theme"}],"knowledge_base_slug":["kadence-blocks","kadence-theme"],"taxonomy_info":{"doc_category":[{"value":417,"label":"Block Tutorials"}],"knowledge_base":[{"value":7,"label":"Kadence Blocks"},{"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\/13261","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\/130753"}],"replies":[{"embeddable":true,"href":"https:\/\/www.kadencewp.com\/help-center\/wp-json\/wp\/v2\/comments?post=13261"}],"version-history":[{"count":4,"href":"https:\/\/www.kadencewp.com\/help-center\/wp-json\/wp\/v2\/docs\/13261\/revisions"}],"predecessor-version":[{"id":14378,"href":"https:\/\/www.kadencewp.com\/help-center\/wp-json\/wp\/v2\/docs\/13261\/revisions\/14378"}],"wp:attachment":[{"href":"https:\/\/www.kadencewp.com\/help-center\/wp-json\/wp\/v2\/media?parent=13261"}],"wp:term":[{"taxonomy":"doc_category","embeddable":true,"href":"https:\/\/www.kadencewp.com\/help-center\/wp-json\/wp\/v2\/doc_category?post=13261"},{"taxonomy":"doc_tag","embeddable":true,"href":"https:\/\/www.kadencewp.com\/help-center\/wp-json\/wp\/v2\/doc_tag?post=13261"},{"taxonomy":"knowledge_base","embeddable":true,"href":"https:\/\/www.kadencewp.com\/help-center\/wp-json\/wp\/v2\/knowledge_base?post=13261"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}