Building and setting up your Shopify theme and store can often be a long, strategic process, but there are some ways you can put your Shopify theme to work before you even launch by using the built in password page feature.
When activated, a Shopify password page displays a “coming soon” message and prevents users from accessing your store homepage, products, collections, blogs and other content.
Premium Shopify themes, meanwhile, often include more advanced looks and options as well as opportunities to promote your soon-to-open store.
Background
One of the most prominent design elements of the coming soon page is the background image.
When selecting a photo to use here, keep in mind it needs to remain viewable at sizes ranging from a mobile device all the way up to huge desktop screens.
The background also needs to allow the text and other information on your coming soon page to remain legible.
Some good techniques for creating a background image for a coming soon page include:
- Use a slightly blurred background image: This not only eliminates image quality issues if the image is stretched on a larger screen, but also makes it easier to read the text.
- Ensure there is enough contrast: If you’re using light text, make the background image darker to make the text easier to read and vice-versa.
- Tease your products: A background image is an easy way to give customers a hint at what types of products you’ll be offering. For added mystery and to ensure maximum legibility, consider using extreme close ups of your products or materials.
- Create a mood and reinforce your brand: The background image is a great way to emphasize an overall look and feel of your store — a luxury goods store can use leather patterns, while a more modern store can use clean lines or abstract shapes.
- Use stock photos: If you're having trouble finding an image that works, try using a stock photo resource.
Spreading the word
Premium Shopify themes typically include the option to collect email addresses from visitors to your coming soon page by activating either a third party email newsletter integration (such as MailChimp) or Shopify’s own built in customer database.
This feature is a great way to not only build excitement before your store launches, but start building or expanding your email list with potential customers.
Changing the messaging
Most of the text found on the password page is easily controllable through either the “Customize theme” settings or language fields:
- The newsletter form is controlled by the “Footer” control panel under “Customize theme”
- Social media icons and links are accessible under the “Social media” subsection
- Your store name is controlled under Settings > General
- Your store logo can be uploaded under the “Header” subsection
Most of the actual text displayed on the page, meanwhile, is stored in your theme’s language settings under the language editor. Once you’ve opened the interface, be sure the “General” tab is selected and then scroll down and look for the “Password page” section.
Here you can edit nearly all of the text that appears on the homepage to best fit your messaging and branding.
Messaging ideas
There are numerous ways to customize the content of Shopify stores coming soon page in creative or unique ways to build more excitement around your impending launch.
Instead of simply gathering email addresses, considering changing the messaging on the password page, in conjunction with the email signup form, to implement these strategies:
- Offer users the chance to enter an email address to be added to the “waiting list.”
- Entering an email address can also add shoppers to an “early access” list.
- Similarly, use the form to let users sign up for a “VIP” list that will be eligible for announcements and special offers.
- Encourage users to provide an email address to receive special offers and notifications exclusive to those who sign up prior to launch.
Remember you’ll need to integrate with an email marketing provider to actually send out emails.
Most of these providers also allow you to create automated timelines to keep your store top of mind with a chain of email marketing that stretches out over days, weeks or even months.
Since you have complete control over nearly all of text on the password page, you can also update the text to match your brand’s voice or be a bit more unique and creative:
- Consider alternatives to “coming soon” or “opening” such as “We’re not quite ready,” “Hang onto your hats” or even “Awesomeness in progress.” This is a great chance to establish your voice and attitude.
- Look for ways to include creative references to your store’s product line into the messaging. For example, a furniture store might use language such as “Crafting a new furniture shopping experience.”
- Instead of “Find out when we open,” consider a catchy line such as “Stay in the loop,” “Get the 411” or, in the furniture store example, “Get the latest from our workshop.”
- Likewise, “Spread the word” can be changed to “Socialize with us,” “Share the excitement” or “Get connected.”
Leverage social
If your brand is already active on social media or blogs, be sure to include links to all your social channels on your password page so that potential customers can start following you before launch.
You can gather new likes and followers this way, and maybe even offer a sneak peek at your wares.
In fact, if you’re already using social sales channels you could potentially even make some sales prior to launch, simply adjust your password page text accordingly, such as “Can’t wait for the shop to open? Shop our Pinterest feed in the meantime!”
And of course the reverse also holds true — you can build buzz for your upcoming shop on your social networks with posts that drive traffic to the shop URL ahead of time, perhaps with the promise of an inside scoop and launch specials if they subscribe to your email list.
Getting more advanced
You can use basic HTML tags in the language settings fields to have better control over font sizes, images and more.
Some handy code that you can use in the “Signup form heading and “Spread the word” fields to add more custom content include:
- <br> will create a new line. Use two of the tags right in a row to skip a line and start a new one.
- <img src=”//path-to-image.png”> will let you insert an image that you’ve uploaded to your file manager. Just replace “//path-to-image.png” with the URL provided here.
- To better control specific colors or fonts of just a word or two, wrap them with <span> and </span> tags that have inline styling. For example: <span style=”color: #000; font-size: 14px; font-family: Helvetica;”>Your text here</span> will create black text at 14 pixels in Helvetica. Just replace the code shown here with your own choices for quick and easy changes.
- Create a box using code similar to this: <div style=”border: 1px solid #000; padding: 20px;”>Your content</div>. Just change the boldface code to your own color and padding setting, which controls the space inside the box.
- <strong>Your text</strong> will make text bold.
- <em>Your text</em> will make text italic.
Incidentally, you can also use these code snippets in many other language fields for finer grain control over other elements of your store, so it’s definitely worth experimenting with.
If you’re feeling more ambitious or have HTML skills, you can also considering opening password.liquid in the theme editor and inserting custom HTML where needed, including the example code snippets above.
While editing HTML and Liquid code is typically not recommended, since password pages are typically only used for a brief period, it’s not as a big of a concern to customize the code.
Just be sure to keep a backup copy of the code in password.liquid in case you upgrade the theme before your store opens.
