What Makes the Voltix Product Page Stand Out?

• Flexible Product Media Layout: Control how product media is displayed for a cleaner and more engaging shopping experience.
• Sticky Shopping Experience: Improve usability and conversions while customers browse product details.
  • Enable Sticky Media: Keeps product images visible while scrolling through product information.
  • Show Sticky Add to Cart: Displays a fixed Add to Cart action so customers can purchase quickly without scrolling back.
• Pickup Availability: Show local pickup availability directly on the product page so customers can easily check store pickup options.
• Complementary Products: Display related or recommended products to encourage additional purchases and improve cross-selling opportunities.

Customize Your Product Page

On the Product Page, you can configure how your product details are displayed, helping customers engage with your items and make purchases easily. Make sure the products are published on your online store before adjusting these settings.

• From your Shopify admin, go to Online Store → Themes.
• Click Customize on the Voltix theme.
• In the Theme Editor, use the drop-down page selector and choose Products → Default product.
• Adjust media layouts, product details, conversion boosters, badges, pickup options, and interactive features as desired.
• Click Save to apply your changes.

Settings Provided To Edit the Product Page

Review the provided information about media types to understand your options. Learn more about media types.

• Breadcrumbs Enable: Enable this option to display breadcrumb navigation on the product page. Breadcrumbs are automatically hidden on the Index (Home), Cart, and 404 templates.
• Color Scheme: Select a predefined color scheme to control the overall appearance of the product page, including background and text colors.
• Desktop Column Width: Choose how the product media and product details are divided on desktop and tablet devices:
  • Equal (50% / 50%): Gives equal width to the media and product details.
  • Wider Media (56% / 44%): Gives more space to the product media than the product details.
  • Wider Details (44% / 56%): Gives more space to the product details than the product media.
• Image Aspect Ratio: Select how product images are displayed:
  • Square: Displays product images in a consistent square format.
  • Portrait: Displays taller product images for a vertical presentation.
  • Landscape: Displays wider product images in a horizontal format.
  • Adapt to Image: Preserves the original proportions of the uploaded product images.
• Apply Background Color to Images: Enable this option to apply a background color behind product images.
• Select Color: Choose the background color applied to product images when the Apply Background Color to Images option is enabled.
• Sticky Media on Scroll: Enable this option to keep the product media gallery visible while customers scroll through the product details. This setting applies to desktop and tablet devices only.
• Thumbnail Position: Choose where the product image thumbnails are displayed:
  • Bottom: Display thumbnails below the main product image.
  • Left: Display thumbnails vertically to the left of the main image.
  • Right: Display thumbnails vertically to the right of the main image.
  
  Note: Mobile devices always use the bottom thumbnail layout.
• Show Thumbnails: Enable this option to display product image thumbnails on mobile devices.
• Show Arrow: Enable this option to display navigation arrows for browsing product media on mobile devices.
• Show Sticky Add to Cart: Enable this option to display a sticky Add to Cart button while customers scroll through the product page, making it easier to purchase the product.
• Product Information Block Border Radius: Adjust the corner roundness of the product information block to create a softer or more rounded appearance.

Product Information Blocks:

In the Voltix theme, Blog Content Blocks help you showcase articles, updates, or stories in a visually engaging way. You can add text, images, videos, and links to highlight key information, making your blog easy to navigate and appealing to readers. These blocks allow you to structure content flexibly, keeping your posts organized and enhancing the overall reading experience.

• Vendor: Display the product vendor or brand name.
• Title: Show the product title prominently.
• Price: Display product pricing and compare-at pricing.
• Inventory: Display real-time product stock availability to help customers understand whether an item is available, running low, or out of stock.
  • Inventory Low Stock Threshold: Set the quantity limit at which the low stock warning should appear.
  • In Stock Color: Choose the color used for the “In Stock” status label.
  • Out Of Stock Color: Select the color used for products that are unavailable.
  • Low Stock Color: Choose the color displayed when product inventory reaches the low stock threshold.
  
  
  
• Variant Picker: Allow customers to select product variants such as size, color, style, or other available options directly from the product page.
  • Picker Type: Control how product variants are displayed.
    • Button: Display variant options as clickable buttons or swatches for faster selection and a more visual shopping experience.
    • Dropdown: Display variant options inside a compact dropdown selector to keep the layout clean when products contain many choices.
  
  
  
• Pickup Availability:Show local pickup availability information.
• Quantity Selector: Allow customers to adjust product quantity before adding items to the cart, creating a smoother and more flexible purchasing experience.
  
• Add to Cart Button: Configure the purchase action area to create a faster and smoother buying experience for customers directly from the product page.
  • Show Dynamic Checkout Button: Enable accelerated checkout options such as Buy It Now so customers can skip the cart and proceed directly to checkout for faster conversions.
  • Enable Gift Recipient Form: Display recipient details fields for gift-enabled products, allowing customers to send purchases directly to another recipient with personalized information.
  
  
  
• Collapsible Tab: Display additional product information inside expandable content sections to keep the product page clean, organized, and easy to browse.
  • Heading: Enter the heading for the accordion item, such as TECHNICAL SPECIFICATION.
  • Content: Add the information you want to display inside the accordion, such as product specifications, features, materials, care instructions, or other relevant product details.
  
  
  
• Complementary Products: Display related or recommended products on the product page to encourage additional purchases and improve product discovery.
  • Heading: Add a custom heading for the recommendations section (e.g., Customers Also Bought) to introduce suggested products.
  • Number of Products to Load: Control how many recommended products are displayed in the section (e.g., 5).
  • Border Radius: Adjust the corner roundness of product cards (e.g., 10px) to match your store’s visual style.
  • Product Cards:
    • Show Background Color: Enable this option to apply a background color behind product cards for improved visibility and cleaner presentation.
    • Image Aspect Ratio: Control how product images appear inside cards.
      • Portrait: Displays taller product images for a modern catalog appearance.
      • Square: Keeps all product images displayed in a balanced square format.
    • Text Alignment: Choose how product information is aligned inside the card.
      • Left: Align content to the left.
      • Center: Center-align product details.
      • Right: Align content to the right.
    • Show Quick View: Enable quick view functionality to allow customers to preview product details and add items to cart without leaving the current page.
  • Manage Complementary Products:
    • Open Shopify Admin → Apps → Search & Discover.
    • Navigate to Product Recommendations.
    • Select the product you want to configure.
    • Open the Complementary Products section.
    • Add related products you want to display.
    • Save the changes.
    • The selected products will automatically appear in the Complementary Products section on the product page.