Header Widget

A header is a horizontal panel usually located at the top of a web page (although vertical headers presented as a sidebar are not uncommon as well). It contains the logo and/or the name of the website and some navigation elements.

With Boxmode, you can either go with a header embedded in your chosen template or add a Header widget manually (if you start with a blank canvas). You can read about widgets and their general settings (how to add, move, resize, and delete them) in our Widgets Overview.

Editing the widget

To start editing the Header widget, click on it to call out its controls. The widget editing menu contains three controls allowing you to customize the widget in multiple ways: Design, Layout, and Template.

Design

By clicking the Design control, you can set the Header widget’s visual parameters: border, shadow, and background color.

Border and Shadow toggle switches turn on and off additional design settings. For example, color, size, and radius are extra tweaks for a border; blur, distance, angle, and color are other settings for a heading’s shadow.

Layout

By clicking on the Layout control, you can change or adjust the general arrangement of elements inside the Header widget.

  • Content alignment. Here, you can choose among three ways of how content aligns horizontally and vertically.
  • Paddings. Use this control to specify space between heading elements.
  • Make header sticky. Press this toggle switch to pin the widget to the top during scrolling.

Template

Here you can choose among several predefined header designs, depending on your needs and preferences.

Editing elements inside the widget

The Header widget includes multiple elements you can edit individually. For example, you can move, resize, edit, or delete the logo and Navigation Menu. To do it, click on the required element to call out its controls and choose the desired option. For more info on how to customize the widget, read our Navigation Menu widget article.

You may want visitors to quickly find contacts, policies, or links to other pages in your header. But to avoid visual clutter it’s advisable to add a footer too. You can find information about Boxmode’s Footer widget in our article.

We hope this guide helped you understand how the Header widget works. Now, it’s time for you to try it yourself.

By using this site, you accept our Privacy Policy