The Product Page is one of the most crucial aspects of an e-commerce website. On Shopify, this page is designed to showcase individual products in detail. The goal is to provide customers with all the information they need to make an informed purchase decision.
Key Fields and Information
Product Images and Videos: This section displays high-quality images and videos of the product. It's possible to include multiple images to show different angles or details, and sometimes a video to give a better sense of the product in use.
Product Title and Description: Here, you detail the product name and a comprehensive description. The description can include the product's features, benefits, specifications, and any unique selling points.
Price: The product's price is prominently displayed. You can also show comparative prices (like original price vs. sale price) to highlight discounts.
Variants: If your product comes in different options (like size, color, material), this section allows customers to select their preferred variant.
Add to Cart/Buy Now Button: This is a call-to-action button enabling customers to add the product to their shopping cart or to proceed directly to checkout.
Product Reviews: Customer reviews and ratings for the product can be shown here, providing social proof and helping in the decision-making process.
Related Products/Upsell: Displaying related products or upselling options can encourage additional purchases.
Main Settings
Make Section Full Width: Expand your gallery to full width for an immersive visual experience — compatible with 'Collage' & 'Masonry gallery' layouts only.
Desktop Media Size: Select 'Large' or 'Normal' to adjust the prominence of media on desktop displays.
Desktop Layout: Choose a layout style: "Carousel - Thumbnails Left", "Carousel - Thumbnails Below", "Collage" or "Masonry" to present your media in an engaging format.
Desktop Image Ratio: Determine the aspect ratio for your images: 'Original Size', 'Portrait', or 'Square' to best fit your product's presentation.
Enable Video Looping: Activate continuous play for your product videos, ensuring they loop seamlessly on your page.
Enable Image Zoom: Allow close-up viewing by enabling a zoom feature on your product images.
Mobile Image Size: Opt for 'Normal' or 'Small' mobile image sizes to optimize visuals for handheld devices.
Section Spacing: Adjust 'Distance from the top' in pixels to tailor the vertical spacing above your section. Modify 'Distance from the bottom' in pixels to fine-tune the vertical spacing below your section.