Customize Store Page and Product Design Style Guide in Squarespace

Customize Store Page and Product Design Style Guide in Squarespace

By Michael Chen

December 27, 2024 at 01:00 AM

Setting the style of your store page on Squarespace helps create a cohesive brand experience. Here's how to customize your store and product detail pages effectively:

Store Page Customization

The store page consists of two main components:

  • A browsable landing page showing all products
  • Individual product detail pages for each item

To access style options:

For Version 7.1:

  • Click [Edit] in site preview
  • Click the paintbrush icon on the store section
  • For product detail pages, click [Edit Design] then the paintbrush icon

For Version 7.0:

  • Open the store page
  • Go to [Website] > [Design] > [Site Styles]
  • Adjust product section settings

Key Customization Options:

Store Page Layout:

  • Image width and aspect ratio
  • Column spacing and number
  • Row spacing
  • Text alignment
  • Add to Cart button display
  • Price visibility
  • Category navigation placement

Product Detail Page Options:

  • Layout types: Simple, Wrap, Half, Full
  • Image display format
  • Gallery options
  • Product description placement
  • Add to Cart button style
  • Related products section

Additional Features:

  • Category navigation customization
  • Status labels (Out of Stock, Sale, Low Stock)
  • Image zoom and quick view options
  • Mobile responsiveness settings

Important Notes:

  • Style changes apply site-wide for consistency
  • Mobile view automatically adjusts layouts
  • Maximum 200 products per page
  • Some features vary by template family

For accessibility considerations, refer to "Creating an Accessible Commerce Site."

Style settings persist across all store pages for brand consistency. Templates may include additional features affecting store appearance.

Related Articles

Previous Articles