If you like the Global Navigation (top menu) styles that are applied on our Theme 2 demos site page, this article is for you. We will show you all the necessary Theme Builder settings you need to apply to get the same result.

We will start with a site that does not have any customizations.

TABLE OF CONTENTS

• Step 1. Open the ShortPoint Theme Builder
• Step 2. Hide Search and Site Info
• Step 3. Update the Header
• Step 4. Update the Menu
• Step 5. Publish your settings

Step 1. Open the ShortPoint Theme Builder

Go to the Site contents/Site Settings > ShortPoint Dashboard > Theme Builder. 

Click the Customize my site button.

Step 2. Hide Search and Site Info

Navigate to the General Settings > Elements > All Sites.

Enable the following:

• Hide Search
• Hide Site Info

This is how your site will look after:

Step 3. Update the Header

• Go to Header > General Layout and enable Full width header;
• Go to Header > Background and set the Header Color Overlay to Primary (or whatever color you may like);
• Go to Header > Paddings & Margins and set Header padding bottom to 0

This is how your site will look after:

Step 4. Update the Menu

• Go to Menus > General Layout and set Menu Alignment to right;
• Go to Menus > Backgrounds and Colors and set:

1. Menu Background Color to Primary (it should be the same color you applied to Header Color Overlay);
2. Menu Text Active / Hover Color to Primary (same as Header Color Overlay too);
3. Menu Text Color to white-light;
4. Menu Hover / Selected Item Background Color to white-light.

• Go to Menus > Paddings & Margins and set:

1. Menu padding top to 14;
2. Menu padding bottom to 27.

This is how your site will look after:

Step 5. Publish your settings

You are done now!

Click Publish to save your customizations:

Related articles:

• Getting Started with ShortPoint Theme Builder - Classic SharePoint Sites (Part 1)
• Getting Started with ShortPoint Theme Builder - Classic SharePoint Sites (Part 2)