Online Audience

How to create a Conditional Header in the Kadence theme? 

create-conditional-header-kadence-theme

Do you want to learn how to create a conditional header in the Kadence theme? Just follow this straightforward guide. I have created a simple header for your easy understanding and explained the settings with the screenshots.

Undoubtedly, the conditional header feature helps you build a personalized user experience on your website. The Kadence theme offers this flexible quality to design your site header with several elements depending on the context.

Let’s see how to implement this impressive feature!

Step-By-Step Guide To Make Kadence Conditional Header

Step 1: Log in to your WordPress dashboard and go to Appearance > Customize

Step 2: Go to Header > General > Conditional header

conditional-header-settings

Step 3: After selecting the conditional header, click “Add Header+” 

add-header-category

Step 4: Choose “Start Basic Header

start-basic-header

Step 5: After choosing this option, it will show an extra header with the setting options. 

Step 6: You have to choose that extra header in the drop-down menu of “Current Previewing Header.” Then, you will be able to see the new design header live.

current-previewing-header

Step 7: I have designed a simple header for your reference. Look at the settings options.

kadence-conditional-header-settings

Output Header

kadence-conditional-header-sample

Step 8: I made this header for my contact page and named it “Contact Page Header.” You may name as per your wish.

Step 9: I have chosen “Display Settings“. Keep my following image as a reference and do the settings.

1. Show on – Single Pages

2. Select Page By – Individually

kadence-display-settings

3. Select items – Select the page where you want to apply the conditional header. After choosing that page, click “Select

select-page-conditional-header

Step 10: Let’s do “User Settings”.

user-settings-kadence

Step 10: After completing the “User Settings“, Move on to the “Expires Settings“. Just enable the settings and fix the expiry date for your conditional header.

expire-settings-kadence-header

Now, check the default and conditional header!

Default Header

kadence-header-conditional-result

Conditional Header

kadence-conditional-header-example

That’s it from my side. I have made a simple conditional header in the Kadence theme to show the settings preferences and let you know how easy it is to use.

You may make a personalized one for your visitors to establish your brand identity. Play with the options to get a unique header for particular pages or blog posts.

Why Should You Design a Conditional Header?

Conditional header has a lot of benefits! It

  • Enables contextual navigation, especially for eCommerce sites
  • Acts as a seasonal header during special events without modifying the default header
  • Increases user engagement to reduce the bounce rate, which in turn helps your SEO
  • Boosts the conversion rate through an optimized header that includes CTA and offers
  • Enhances mobile experience through a streamlined header made for small screens

FAQs

1. Is the conditional header available in the free Kadence theme?

No! You should get the Kadence Pro theme to get this feature.

2. How do you delete this Kadence header?

You must click the “Default” option in the Current Previewing Header and confirm. You may also use the “Remove Header” button.

3. Is this header enabled by default in the Kadence theme?

No! It is not activated by default. Go to Appearance > Kadence and turn on this feature.

Wrapping Up

Conditional headers serve the needs of your audience when they are perfectly designed. Kadence’s theme has several fantastic qualities, and it is one of them. I’m glad you are leveraging conditional headers to build a versatile website to support your business goals.

I have done my best to explain the settings for this feature. If you have any doubts or need help, contact me through the comment section. As I’m using this excellent WordPress theme to design my client sites, I can help you finish the task.

The post How to create a Conditional Header in the Kadence theme?  appeared first on WPGLOSSY.

Leave a Comment