As you have known, Elementor Pro comes with a theme builder feature which you can use to create a custom header for your WordPress website. You can assign the custom header you create to any area of your website. However, there is no built-in option to show/hide the header based on the login status yet. The ability to hide an element is one of the demanded Elementor features. While its main competitor Divi Builder has just released a feature to hide elements, you can only do so using an add-on in Elementor in the meantime (read: Elemento vs Divi). JetEngine is one of the add-ons that you can use.
JetEngine is a versatile Elementor add-on from Crocoblock. While it’s mainly designed to create custom dynamic content (custom fields and custom post types), it also comes a feature to allow you to show/hide an element in Elementor. Be it section, column, or widget. There are some conditions offered by JetEngine to show/hide an element, including login status. You can utilize this feature to hide a header for logged users.
Reasons to Hide the Header for Logged in Users
There are some reasons and scenarios why you need to hide the header for logged in users. One of the examples is when you are creating a membership website whereby you want show two different headers for logged in users and logged our users.
Whatever your reason, let’s jump to next section to learn how to use JetEngine to hide header for logged in users.
How to Hide Header for Logged in Users in Elementor Using JetEngine
Before getting started, make sure you have installed JetEngine. You can download JetEngine on the official website of Crocoblock at $26 per year.
Once JetEngine is installed and activated, edit the header you want to hide. If you haven’t created a custom header using Elementor before, you can read our previous article to learn how.
Once your header opens on the Elementor editor, edit the section of your header by clicking the handle to open the settings panel. Once the settings panel opens, go to the Advanced tab and open the Dynamic Visibility block. Switch the Enable toggle on.
Select the Hide element if condition met option on the Visibility condition type dropdown. On the Conditions dropdown, select User logged in.
You can add multiple conditions if you want. Simply click the ADD ITEM button to add a new condition and then select the relation on the Relation dropdown.
Update your header once done editing.
If your header consists of more than one sections and you want to hide them too, you can simply repeat the steps above.
