Truly fine instructions

Documentation.

Header

The header section controls the announcement bar and the master header section of your shop.

Announcement bar

Section settings

Text + Link: Optionally add a brief label of text to be displayed on the left area of the announcement bar. It supports a link where the entire section will be linked to.

Menu: Optionally add a helper menu to be displayed on the right area of the announcement bar.

Colors

Color scheme: Select one of the predefined color schemes as defined in Theme settings > Colors. For more information regarding the color schemes please refer to our article about creating your own color scheme.

Header

Logo settings

Image: Upload the image file of your logo in this area to set it globally on the header of every page.

Custom width: Adjust the width of your logo.

Contact details

Contact details: Using the Heading and Subheading fields you can set some additional contact info on the header that will be displayed next to the search bar.

Navigation

Main Menu: The main menu of your shop.

Secondary Menu: The secondary menu of your shop. This will be displayed on the main menu area but will be fixed positioned on the right. This is helpful when you want to make a menu item stand out for a particular offer.

Mobile menu: Optionally you can override the Main Menu as the menu that mobile users will see. Helpful in case you want your mobile menu to be simpler or different. It is highly recommended that you leave this empty and use the Main Menu instead for SEO purposes, since Google predominantly uses the mobile version for indexing. More info on this here.

Mobile sub-menus expand on arrow click: This controls how your mobile menu’s submenus will open. If left unchecked the entire top level menu item will be clickable and expand its submenu. If checked, only the arrow will expand its submenu, and the menu item will navigate to its link.

Mega menu

Adding a mega menu to your main navigation is simple. Under the Header section click on “Add Mega menu”.

Click on the Mega menu item enter the exact name of the first level menu item you would like to transform to a mega menu.

For example: Your main navigation is consisted of “Home”, “Shop by category”, “Shop by brand”, “New arrivals”, “Contact”. If you wanted to have “Shop by category” and its sub-menu to be the mega menu you would type “Shop by category” in the Menu item field.

Now every sub-menu on that menu item will be turned into a list of menu items.

Please note: For a mega menu to make sense, your mega menu item top level item should have two more levels of items.

You can also add a Side item with an Image, Heading, a brief description (Text) and a Link to point to. The side item of your mega menu will always be displayed as the last item in the menu.

Language & country selectors

Control the visibility of the language and country selectors. Please note that these settings will need configuration in your store’s language and payment settings respectively.

You can read about setting up multiple languages and selling across multiple currencies in the Shopify documentation.

Layout

Sticky header: Make your shop’s header appear when scrolling up. Please note: This feature is disabled in the designer mode for practicality, it will be enabled in your actual shop pages.

Colors

Each area of the header can be customized to its own color scheme. Header, Navigation, Sub-menus, and Mobile navigation.

Select one of the predefined color schemes as defined in Theme settings > Colors. For more information regarding the color schemes please refer to our article about creating your own color scheme.

Features

The header features section is the same as the global Features section. It is consisted of multiple feature blocks with the following settings:

  1. Icon: Set an icon for the feature box (optional). For example, if you want to create a support card, typically you would want to choose the “Phone” icon.
  2. Image: If an icon is not desired you can optionally upload your own image for the feature box. Recommended size for best viewing is 80×80.
  3. Price: The price section displays the price (as well as discounts, group pricing, and other pricing info) has no customization settings.
  4. Title: The title of the feature box. In the previous example of the support card it could be your phone number or an email.
  5. Text: A brief description of the feature.

Can't find what you are looking for? Feel free to submit a request.