Creating presale product pages

Learn how to add presale support to your store’s product pages.

1. Overview

In this guide, we’ll walk through the integration of Submarine into the product page of a Shopify Online Store 2.0 theme. We’ll be using Shopify’s source-available Dawn theme as our starting point, with all the changes outlined in this guide reflected in our publicly-available reference theme.
Our goal will be to add a component to the product page that can:
  • Read Submarine metafield data to determine the presale status of the current product;
  • Display the presale status of the product to the customer;
  • Dynamically set the correct presale selling plan when the product is added to the cart.
Image without caption