Navigation links
Section overview
Navigation links is a slideshow-like component similar to Instagram stories that displays circular images with text labels underneath. It can be configured as either a slider or a grid layout.
Common use cases
Highlight key navigation categories or pages in a visually appealing way
Create a visual navigation menu for featured collections
Display a set of linked categories with consistent styling
Create a mobile-friendly navigation experience
Usage tips
Use appropriately sized images (recommended 256px by 256px) for best results
Keep heading text short and concise for better mobile display
For mobile use, the slider view is generally more effective than grid view
Consider visibility settings to show different navigation styles on desktop vs mobile
Section settings
Top spacing
Controls the padding above the section (0-50px)
Bottom spacing
Controls the padding below the section (0-50px)
Color scheme
Sets the background and text color theme for the section
Border color
Sets the color of any borders used in the section
Border position
Controls where borders appear (none, top, bottom, or both)
Size
Determines the size of the circular images (small: 60px, normal: 100px, large: 140px)
Container
Choose between slider (scrollable) or grid layout
X alignment
Sets horizontal alignment (left, center, or right)
Enable margin
When enabled, applies horizontal margin to the section
Visibility
Controls whether the section is visible on all devices, mobile only, or desktop only
Block settings
Link
The Link block creates a circular image with a text label that links to a URL. Each block represents a single navigation item.
Block limit: 20
Image
The image to display in the circular container (recommended 256px by 256px)
Heading
The text label displayed below the image
URL
The destination page when the navigation item is clicked
Last updated
Was this helpful?