Styling the Top Bar

Would you like to change the look of the bar that sits above your main header? The top bar in Botiga is an optional content bar you can enable and style from the Customizer.

In this guide, we’ll walk you through how to style the top bar in Botiga.

Before you get started, make sure you’ve installed and activated the Botiga theme on your WordPress site.

Note: If you’re using the Header and Footer Builder, refer to our guide on the Header and Footer Builder instead. The instructions below apply if you’re using the older header and footer system.

Style your top bar in Customize » Header » Top bar on the Style tab. If you only want to enable it without changing the style, follow the same path and use the General tab.

The top bar settings in the Botiga Customizer

On the Style tab, the available options are:

  • Background color: The background color of your top bar.
  • Text color: The color of every element you add to the top bar.
  • Top and bottom padding: Adjusts the spacing above and below the top bar, which controls its height.
  • Border size: The width of the border between the top bar and the main header.
  • Border color: The color of the border between the top bar and the main header.
  • Border width: Either contained or full-width, which stretches to the edges of the screen.
The top bar style options in the Botiga Customizer

That’s it! You’ve successfully styled the top bar in Botiga.

Next, would you like to turn the top bar on and add content to it? Check out our guide on enabling and configuring the top bar to learn more.

image_print