Header Block

The Header is a specific type of Block that is displayed on all website pages. The Header style remains the same on all pages. Usually, it includes the Menu, Logo, or Title. It is a theme element in WordPress and Joomla.

When the Header is selected, you can see the titles on the markers.

Header Presets

Nicepage provides a library of Header Presets to help you get started with the new Multi-Row Header layouts.

Back To All

While adding the Header Elements, you can click the 'Back To All' link on the Add panel, allowing users to easily return to the main list of elements after selecting a header, footer, or other element.

Hide Header From Context Menu

You can hide the Header via the Context Menu or the Property Panel -> Page tab.

Locked Header Height

We lock the Header Block's Height so it stays unchanged while you add Header Elements.

High Header Outline Color

Users usually do not recognize the limitations of the high Header Blocks. Therefore, the marking lines change to orange, making the boundaries more visible.

Show Header Link

You can now click a link near the Page Options icon to re-enable the Header when it is hidden.

Add Header to My Library

You can add a Header Block to My Library to use the same Header layout in different projects:

Export And Import Header

You can export and import Header and Footer Blocks to your disk.

Multi-Row Headers

Learn more about the Header Blocks.

This option keeps the Header Block at the top of the page, even if you scroll.

Sticky Header Tabs

You can use Tabs for the Sticky Header option, making it much easier to design and organize content in headers that remain fixed as you scroll.

It simplifies editing and improves the experience when the Header overlaps the next Block.

Sticky Header Border and Shadow

When scrolling, you can add a Border and a Shadow to the Sticky Header to enhance the page's appearance.

Please note that you will see the results of these options only in the preview or export.

Sticky Header Block Border and Shadow

You can also apply the Sticky Border and Shadow option for the Header Block if you use several Blocks in the Header.

Sticky Option for Each Header Block

You can use the Stick property for any Header Block. Please note that you can only see the sticking on exported sites or previews.

You can stick a required Block and unstick all others.

Header Shadow

You can enable the Shadow for the Header Block or apply the Shadow Effect for the Sticky Header on Scroll.

Best Practices For Header Rows

Tall Headers

While resizing the Header to make it very tall, we have changed the Best Practice dialog to offer you the option to add a Header Row instead.

Full-Width Shapes Or Lines

When adding a Shape or Line element and making it screen-wide, the Best Practice dialog appears, offering the option to add a Header Row.