Menu Images

This section helps create an engaging visual structure by pairing menu items with representative images, ideal for showcasing categories, promotions, or featured collections.

The Menu Images section is a unique feature available only in the Closed Menu header design. It allows merchants to visually enhance their navigation by assigning images to specific menu items. These images appear once you click the Open button in the header and the closed menu expands.


Option

Values / Inputs

Description

Image hover effect

Basic theme settings, Disable, Zoom in #1, Zoom in and rotate, Zoom in #2, Zoom out #1, Zoom out #2, Slide, Shine

Defines how images react when a user hovers over them. You can inherit the global hover animation using Basic theme settings, disable animation completely, or select a custom zoom, slide, or shine effect to create a dynamic user experience.

Image ratio

Auto, Portrait (3:4), Landscape (4:3), Square (1:1), Round (1:1), Social story (9:16), Widescreen (16:9)

Controls the aspect ratio of the menu images. This ensures consistent visual proportions across the navigation. For example, Portrait works well for product shots, while Widescreen fits banners or landscape visuals.

Menu item images (1–16)

Image upload for menu item #1–#16

Allows adding up to 16 individual images, each linked to a specific menu item. These images appear within the expanded menu view, offering a visual cue or promotional element for each category. All 16 blocks share identical settings for consistency.


Usage Notes

  • The Menu Images block is exclusive to the Closed Menu header type and does not appear in other header layouts.

  • Each image corresponds to a single menu item (e.g., “Menu item #1” links to “Women,” “Menu item #2” to “Men,” etc.).

  • Use consistent image sizes and ratios for a clean, professional appearance.

  • To maintain visual harmony, it’s recommended to match the image ratio setting with your global theme image settings.

Last updated