Styling the Top Bar

Note: If you are using the ‘Header & Footer Builder’, please refer to this link. But if you are using the old header and footer system, you can consider the below instructions.

The top bar is an optional content bar that you can choose to display right above your site’s main header. 

You can style your top bar by going to Customize > Header > Top bar (Style tab). If you only want to enable it (without customizing the style), follow the same path but select the General tab.

file-kii9krtwfe-3353520

In the Style tab, the available options are:

  • Background color – the background color of your top bar
  • Text color – the color of all elements that you add to the top bar
  • Top & bottom padding – adjusting the spacing above and below the top bar (thus controlling the height of the top bar)
  • Border size – the width of the border between the top bar and main header
  • Border color – color of the border between the top bar and main header
  • Border width – either contained or full-width (stretches to the edges of the screen)
file-aicm3ljdyi-2831296