Version 7.0 templates offer specialized mobile styling options to enhance your site's appearance on different devices, beyond standard responsive design features.

Accessing Mobile Settings

• Open device view to preview mobile design changes
• Use Ctrl + F (Command + F on Mac) to search for "Mobile"
• Search for "Min" to adjust font scaling

Template-Specific Mobile Options

Aviator:

• Adjustable logo size
• Toggle background image visibility
• Customizable background colors

Brine:

• Single or dual navigation bars
• Fixed top bar option
• Custom header icon styles
• Adjustable icon placement
• Mobile breakpoint control
• Store page styling options

Farro:

• Single or dual navigation bars
• Fixed top bar option
• Custom header icon styles
• Adjustable icon placement
• Store page customization
• Hideable thumbnail grid titles
• Site title color and font options
• Separate mobile logo support

Skye:

• Font scaling options
• Store page customization
• Logo/site title toggle

Tremont:

• Font scaling
• Device-specific size settings
• Store page styling
• Site title customization
• Mobile navigation background color

York:

• Font scaling
• Mobile top navigation bar
• Custom header icon styles
• Store page options

Key Mobile Features

Font Scaling:

• Manual control over maximum/minimum text sizes
• Customizable for titles, headers, and key text elements

Logo Optimization:

• Adjustable logo size for mobile devices
• Recommended smaller display for better content balance

Navigation Bars:

• Top or bottom placement options
• Customizable colors and elements
• Header components integration (logo, cart, search)

Store Page Customization:

• Mobile-specific styling for item titles
• Custom price display options
• Sale price formatting

These mobile optimization options ensure your site looks professional and functions effectively across all devices while maintaining brand consistency.

Related Articles

Previous Articles