How to create Headers

Estimated reading time: 1 min

To create a new header:

  • Access Rey Theme > Global Sections
  • Hit Add new.
  • Select “Header” in the Type option.
  • Publish the page
  • Hit Edit with Elementor
  • Add elements from the Header elements group, or use the Template Library and import a header.
Select Header in the Type option and click on Edit with Elementor.

Globally assign the newly created Header global section?

Simply access Settings › Header › General and you should be able to pick the header you just created.

Choose a Header global section in Theme Settings.

How to change the header global section per page?

Edit the page you want to change the header on, and look for the Header settings, where you can pick the header itself, text color fallback and position.

Choose the header per page individually.

How does header positioning work?

Read more in this article.

How to create a custom sticky header?

To make the header Sticky, just pick Sticky in the Header position option, as mentioned above.

However there might be cases when you want the header when sticked, to be different (simpler logo, simpler navigation, less icons etc).

If that’s your goal, you can use Rey’s “Sticky Top Section” feature which allows you to pick a separate header global section and use it as sticky header.

Learn more in this article.

Tips & Tricks for creating headers

When creating headers, try as much as you can to use elements inline, in a single column, aligning them either left or right horizontally, and centered vertically. They will flow more naturally vs. adding columns for each element.

For example here’s a quick screencast how to position elements inline to fit well in a single column recording .

Why is clicking disabled on header components in Edit mode?

For example clicking on Menu items or Search box.

Because it’s not stable and conflicts with Elementor’s actions. Hopefully i’ll find solutions in the future to enable clicking.

Show comments and replies (closed)Hide comments and replies

Left here in 2020, when comments were open. The answers were written then and may describe a version of Rey that has changed since.

  1. Rick

    For example here's a quick screencast how to position elements inline to fit well in a single column [link no longer available] .

    The above would not load in a month of Sundays. That's a quant old saying meaning its fucked.

    Its really helpful to have these links to the editor panels because for new kids like me for whom this stuff is not something they have been doing for the last five years it helps to visualise what you are saying. Hopefully then when I get to that panel I will remember what it was you said to do. Hopefully.

  2. MariusRey

    Hey Rick,

    On my end the video seems to load fine. Here's another link you could download the vid [link no longer available] .

    Marius

Was this article helpful?