How to find these settings...
- Online Store
- Customize (Theme Editor)
- Header
- Left column, access content blocks using black arrow next 'Header'
By default, menus with sub links will be simple dropdowns. You can choose to customize the dropdown to use a mega menu, story bar or contact bar. Each will have additional options and promotions.
Recommended reading
In this section...
Mega menu
Link title
Type the menu title you want to associate the block to. It is recommended to use a collection or product link to take advantage of images.
NOTE: This must match the title capitalization and punctuation exactly:
Sub links will be displayed in each column:
Minimum number of desktop link columns
The number of columns displayed on a full width screen. This number excludes the Promotion. 2 is the minimum, and it steps up by 1 to a maximum of 5
Custom link color
Choose a custom color for the link title
Image
There are 3 options for the image:
- None: Exclude an image
- Collection: Use the collection image
- Product: If the link is a collection, choose the first product image instead of the collection image
Insta filter
App like filters can be applied to your images
Image aspect ratio
The image has 4 options for display:
- Natural: Uses the height of the image
- Short (4:3): A landscape format will be applied
- Square (1:1): A square format will be applied
- Tall (2:3): A vertical format will be applied
Enable image crop
The image will crop to fill up the container format chosen with 'Image aspect ratio'. NOTE: If disabled, white space will be applied around the image. Has no effect when media aspect ratio is set to 'Natural'
Focal point
Similar to setting a focal point on a theme image, background images can specify the main focus of the image
Center text
Center the sub links in the column
PROMOTION
Enable promotion
Add a promotion to the mega menu
Promotion position
Choose to display the promo at the beginning or end of the sub links
Text
Add text to describe or highlight the promo
Link
Add a link using the link picker or type your own
Link text
Add a text to describe what action to take for the link
Text position
There are 4 text layout options:
- Split
- Top
- Center
- Bottom
Text color
Choose a custom color for the text
Background color
Choose a custom color for the background
Background color opacity
When a 'Background color' has been selected, control the opacity with the slider. 0% is the minimum, and it steps up by 1 to a maximum of 100%
Desktop image
The desktop image will be displayed when the container is greater than 640px wide. NOTE: Background images can use Focal Points to specify the main focus of the image. Learn more about Focal Points
Insta filter
App like filters can be applied to your images
Mobile image
The mobile image will be displayed when the container is less than 640px wide. NOTE: Background images can use Focal Points to specify the main focus of the image. Learn more about Focal Points
Insta filter
App like filters can be applied to your images
Story bar
Link title
Type the menu title you want to associate the block to.
NOTE: This must match the title capitalization and punctuation exactly:
Custom link color
Choose a custom color for the link title
Heading
Title of the section or feature
Text
A text block for basic formatting including bold, italic, formatted lists & linked text
Link
Add a link using the link picker or type your own
Link text
Add a text to describe what action to take for the link
Text alignment
Text can be aligned to the left, right or centered to the container
Image
Select a background image. NOTE: Background images can use Focal Points to specify the main focus of the image. Learn more about Focal Points
Insta filter
App like filters can be applied to your images
Contact bar
Link title
Type the menu title you want to associate the block to. It is recommended to use a collection or product link to take advantage of images.
NOTE: This must match the title capitalization and punctuation exactly:
Custom link color
Choose a custom color for the link title
CONTACT INFORMATION
Phone number
Add a link for the store phone number
Email address
Add a link for the business email
Hours/store information
Use the text block formatting to style the info using bold, italic, formatted lists & linked text
Street address
Use the text block formatting to style the address using bold, italic, formatted lists & linked text. NOTE: This is the address that the map will use
Show map
Add a map to the Contact dropdown
Google Maps API key
You'll need to register a Google Maps API Key to display the map
Zoom
1 is the minimum, and it steps up by 1 to a maximum of 6
Map foreground & background color
Choose 2 colors to customize the map to match your stores style