Product main
Built advanced product pages (pdp) with Shoshin
The product page is one of the most important areas of any Shopify store, alongside the homepage, collection pages, and the cart. It’s where customers make their final purchase decision. That’s why we’ve invested significant effort into designing the Product Main section to be powerful, flexible, and conversion-focused.
With Shoshin, you can build advanced product pages that not only look great but are also optimized for performance and sales. Like all parts of our premium theme, the Product Main section comes with a wide range of advanced features that are ready to use out of the box. Each feature is added as a separate block, giving you full control over layout, content, and functionality. The important blocks are documented individually and listed in the menu on the left.
Where this section can be used
The Product Main section is primarily designed to be used on the product page. However, you’re not limited to that use case. You can also add this section to other pages if it fits your strategy. For example, many merchants choose to place it on the homepage to highlight a featured product, such as a “Product of the Month.”
In addition to general settings like color scheme and spacing, this section includes an option to manually select a product. When used on a product page, you don’t need to select anything. Simply leave the product field empty, and the section will automatically load the current product being viewed. When used on other pages, selecting a product allows you to showcase it anywhere in your store.
Available blocks
The Product Main section includes a rich set of blocks that allow you to build a fully customized and high-converting product page. Each block can be enabled, reordered, or removed depending on your needs.
The most important blocks are documented separately and can all be found under the Product section in the menu on the left. This makes it easy to explore each block in detail and understand how to configure it for your specific use case.
Gallery – The main product media gallery used to display product images, videos, and 3D content. Supports a full-screen gallery experience.
Title – Displays the main product title.
Price – Shows the product price. When enabled, this block can also display the Shop Pay Installments banner.
Rating badge – Displays the star rating badge. This block is independent of any specific reviews app, as it’s integrated directly with Shopify and works with any review solution.
Options – The main product options or variant selector, allowing customers to choose variants.
Buy buttons – Includes the main Add to Cart and Buy It Now buttons. This block also displays the quantity selector and the Wishlist button (if enabled).
Rich text – A flexible content block (heading + description) for adding extra information such as product features or bullet points.
Collapse – A collapsible content block, ideal for product pages as it helps hide long content and improves the overall user experience. Typically used in groups.
HTML / Liquid code – Allows you to add custom HTML or Liquid code when needed.
Trust icons – Helps build customer trust by displaying icons with short text, usually highlighting what differentiates your brand. Commonly, 3–4 icons are used.
Breadcrumb – Helps users navigate your store hierarchy more easily.
Separator – A visual divider, especially useful on longer product pages to separate sections and improve content flow.
Inventory bar – Displays available stock with a progress bar. Most effective when stock is low, as it creates urgency.
Quantity breaks – An advanced block designed to increase average order value by offering discounts when customers buy higher quantities.
Upsell checkbox – Makes it easy to upsell additional products directly on the product page using a simple checkbox.
Personalization field – Adds input fields (text, file upload, etc.) to collect extra information from customers. Commonly used for personalized products.
Local delivery – If local delivery is enabled in your Shopify admin, this block displays your store address and related delivery information.
Prev / Next buttons – Improves navigation by allowing customers to move quickly between products using buttons on the left and right sides of the screen.
Delivery info – Enhances the shopping experience by showing estimated delivery dates.
Countdown – Creates urgency by displaying a countdown timer, especially useful for limited-time sales or promotions.
Product switcher – Ideal for stores with very similar products, allowing customers to switch between them directly from the product page.
Media (image/video) – Lets you add additional images or videos outside of the main product media gallery.
@app – A reserved Shopify block that allows installed apps to inject their own blocks into the product page.
Last updated