Built-In

Header & Page

Layouts

Explore built-in header and page layout options included with TheGem. Combine versatile header styles, navigation concepts, and flexible page structures to create unique website designs.

Built-In Header Layouts

TheGem includes versatile settings for website header, menu and navigation. It delivers 8 navigation concepts in total of 20+ pre-made styles for main menu and top area bar, which you can freely combine with each other. And you can adjust all this styles – change colors, fonts, backgrounds etc. In addition you can set individual settings for selected pages of your site. Enable transparency for main menu & top area. Control header opacity. Use customized colors for menu & logo. Use images and videos as backgrounds. Enable or disable sticky headers and navigation. And much more.

Logo Position

Left Logo

Centered Logo

Right Logo

Centered Above Menu

With Vertical Menu

With Hamburger Menu

Menu Layouts

Standard

The classic horizontal navigation layout, perfect for any corporate website or online shop

100% Width Menu

Horizontal navigation with 100% width layout, ideally suitable for creative websites

Vertical Menu

Vertical navigation layout, good for portfolio and photography websites

Hamburger Menu

Hamburger menu navigation for minimalistic and modern layouts. Excellent for any website

Overlay

This navigation layout is a good choice for agencies and any other creative websites

Perspective

A fresh, creative and unique navigation layout with unusual page transformation effect

Mobile Menu Layouts

Classic

Classic responsive drop down navigation with rolling out hierarchies

Overlay

Responsive navigation via an overlay representation, ideal for any touchscreen

Slide Left

Mobile menu sliding from the left side. Perfect for depicting complex hierarchies

Slide Top

Similar to slide left mobile navigation, but sliding from the top of the screen

Top Area Layouts

Left

Centered

Right

Disabled



Customizable
Header Styles

customize it to your needs via theme options. You can adjust colors, fonts, transparencies etc. making your own unique header style

PRE-MADE STYLES COMBINATIONS

Customization Examples

Page Header
Options

In additional you can set this options for displaying your menu and top area bar per page. In this way you can set individual menu settings for selected pages of your site.

Enable transparensy for main menu & top area

Control header opacity

Use customized colors for menu & logo

Use images and videos as backgrounds

Disable top area

Built-In Page Layouts

Create pages with complete layout freedom using the built-in layout options. Thanks to a wide range of flexible layout options, you can design 100% width, full-width, or boxed layouts; use any number of sidebars in any position; and mix different layout approaches to create your own unique page style.