Main navigation layout settings

Overview #

The settings outlined here define core theme settings for managing the layout of main navigation blocks. These settings are essential for controlling the overall look and feel of the shop, as they are applied app-wide but can be overridden at the section or block level. They help manage how navigation elements are displayed across the site, ensuring a consistent and customizable user experience.

Key components and functionality #

Layout settings - Main navigation blocks

This setting group is designed to manage the layout and appearance of the main navigation blocks within the theme. It provides options to customize how navigation elements are displayed, enhancing the visual coherence and usability of the site.

Display fill available space

This setting allows you to enable or disable the option to fill available space within the navigation blocks. When enabled, the navigation elements will stretch to occupy the full width of their container, providing a balanced and uniform appearance. Default: Disabled

Display centered

This setting provides the option to center the navigation blocks within their container. Enabling this setting will align the navigation elements to the center, which can be useful for creating a symmetrical and aesthetically pleasing layout. Default: Disabled

Usage examples #

1. Filling available space: You might consider enabling the Display fill available space option if your navigation menu has fewer items and you want them to spread out evenly across the header. This can ensure that the items are distributed evenly, making the navigation look more structured.

2. Centering navigation: For a minimalist design where the focus is on the central part of the page, you might consider enabling the Display centered option. This will align your navigation items to the center, which can be particularly effective on pages with a lot of whitespace or when using a single-column layout.

These settings provide flexibility in how navigation elements are presented, allowing for a tailored user experience that aligns with the overall design goals of the theme.