How to Create High-Converting Landing Pages in Shopify

July 29, 2021
Michelle Deery

How to Create High-Converting Landing Pages in Shopify

July 29, 2021
Michelle Deery
Get the latest straight to your inbox
Thank you! Your submission has been received!
Oops! Something went wrong while submitting the form.
Share on:

Acquiring quality traffic to your online store can be expensive. 

You either have to pay for ads or invest in content to get potential customers to visit, so it’s critical to convert the traffic that you are getting.

Ecommerce landing pages can help with this because they’re designed to convert well—with some businesses achieving an average conversion rate of 11.45%

In this post we’ll explore:

And we’ll share a bunch of real-life examples of custom pages built by brands doing this right.

But first...

#cta-visual-pb#<cta-title>Build a high-converting Shopify landing page<cta-title>Start using Shogun Page Builder to build and customize landing pages that drive shoppers toward purchase faster.Start designing today

Why your Shopify store needs landing pages

A landing page is technically any web page designed to get a potential customer to take the next step in your sales funnel. 

For your store, this next step can be:

  • Buying a product
  • Signing up with an email for a free sample 
  • Subscribing to an email newsletter for store deals
  • Joining an exclusive waiting list for a particular product
  • Providing an email address to unlock free shipping

Dedicated landing pages focused on just one ecommerce offer convert well because of the phenomenon known as the Paradox of Choice

The more options we have, the harder it is for us to make a choice, which causes friction.

Colloquially known as “analysis paralysis”—this is when you feel so overwhelmed by options that you nothing. 

The more options you give a store visitor at a given time, the more likely they’ll feel overwhelmed and click the “Back” button. 

However, if you present visitors with one clear option for what to do next, you simplify the decision-making process.

Further, the data indicates that dedicated ecommerce landing pages convert around 60% better than ecommerce websites taken as a whole. 

Aside from converting more sales, adding especially custom Shopify pages to your store can help you:

  • Conduct A/B tests to constantly improve. Instead of guesswork, you can gather insights that tie the success of your marketing campaigns to hard data. You'll continue to refine your Shopify landing pages over time to ensure you’re serving up what works best for your target market. Testing correctly has been seen to increase conversion rates by up to 300%.
  • Speak to a specific audience. Creating targeted landing pages that highlight specific features for different customer segments will help your visitors know they’ve reached the right place and prompt buying decisions.
  • Improve paid search campaigns. With dedicated landing pages, you can match your store’s PPC landing pages and ad copy with the keywords you have bid on to maximize the ROI of your campaigns. In short, your Shopify landing pages can deliver contextually relevant experiences after an ad click, preventing visitors from restarting their search. 

Learn more about creating especially great landing pages by following our top landing page best practices for driving conversions.

Types of landing pages for Shopify stores

Here are some of the most common ecommerce landing page types top Shopify brands are customizing for their stores:

  • Discount pages
  • Product pages
  • Product collections pages
  • Coming soon pages
  • Bundle pages
  • Collaboration pages
  • Seasonal pages
  • Consultation pages

Let’s take a closer look at each type in action…

Discount pages

Discount pages help you secure potential customer’s contact details (typically their name and/or email address) so you can re-market store promotions to interested visitors later. 

Example: Bootstrap Beverages

Bootstrap Beverages offers site visitors $10 off their next purchase in exchange for their email. 

Here’s a closer look at above the fold on this page:

  • Below the fold Bootstrap shows related products you can add to your cart
  • They showcase social proof in the form of company logos (presumably the brands they sell to) and some selected 5/5 customer reviews, and lastly
  • They showcase imagery of the product being enjoyed

Single-product pages

You can create a landing page for a particular product line, or to raise awareness for a particular retail location. 

This type of page helps visitors add a particular product from a collection to their cart, or directs folks to where they can make the purchase in the case of wholesale. 

#cta-mini-fe#Find out if your store is a good fit for headless commerce.Take the quiz

Example: Kodiak Cakes

Kodiak Cakes use this approach for their nut butter syrups: they have a Shogun-built landing page on their Shopify site that directs potential customers to Target where they can buy this particular line of products.

Note the call to action here: “Find a bottle”, wherein visitors are directed to Target to purchase over there:

The page even features ideas for what you can do with these nut butter syrups! And of course, the product specifications:

#cta-visual-pb#<cta-title>Create better landing pages<cta-title>Your Shopify store could be driving more conversions with the right pages—start building them today.Try Page Builder today

Product collections pages

Once you’ve amassed a collection of products, you’ll likely need especially compelling product collections pages. 

And while Shopify has great options for arranging a basic collections page—many brands want to add custom elements to make these as high-converting and on-brand as possible. 

Example: Craft 

Craft has a landing page for their new Charge collection:

They use text elements to introduce the collection at the top of the page, slider elements to showcase featured products, and generally lots of slick imagery to spotlight different items. 

And, of course, the call to action here is “Shop the collection”—directing visitors to individual product pages to checkout.

Want to add a slider element to your pages?
Explore all the pieces you can customize your pages with in Shogun’s Elements Library.

Coming soon pages

Have an upcoming product that isn’t available for sale yet? 

You can build a pre-launch list with a Coming Soon” landing page.

Example: TKEES

Here’s the “Coming Soon” landing page that Shogun customer TKEES used to build a waiting list for their new collection. Take note of the call to action: “Join the waitlist”:

Editor's note: a countdown timer can really help add urgency to a coming soon page like this one from TKEES. Look for opportunities to let your audience know when a special offer is in play for.

Bundle pages

You can create special offers by bundling various products together. You can also provide discounts on these bundles on holidays and other special occasions. 

Example: ManCave

ManCave has created a landing page for their self-care bundles.

The landing page displays information about four separate bundles, the XL shower bundle, the workout bundle, the shower essentials bundle, and finally the advanced skincare bundle.

On this page, you're invited to join the company’s email list to get exclusive access to discounts. This grows the brands' email list and helps bring customers back to the website.

Collaboration pages

Do you often collaborate with other companies and individuals on various projects? 

Then it might make sense to create a landing page dedicated to these collaborations so potential customers can learn more and purchase. 

Example: SAWA 

Sawa has a Shogun-built collaborations page where they showcase various partnerships they have been engaged in over the years. 

Below the details, there’s a call to action encouraging users to share their collaboration ideas.

Seasonal pages

Consider creating seasonal product pages that not only promote your products but also provide information relevant to that season. 

Example: Flow

Flow has an autumn landing page where they share seasonal beekeeping tips. It allows them to target specific visitors around the autumn and winter months of the year.

Consultation pages 

If you offer consultations as a way to help customers find the most relevant products, a dedicated consultation landing page can help you get more bookings.

Example: Briogeo

Briogeo offers hair + scalp consultations and has a separate landing page where you can book one.

It’s awesome they include information on what you can expect when you book a consultation, booking instructions, and a calendar where you can select a time and date!

How to create a custom landing page for Shopify (within Shopify)

There are several ways to build Shopify landing pages for your store. Let’s start with the most basic.

Building a basic Shopify landing page

Create a new page in Shopify by first clicking on “Pages” in your Shopify dashboard, then clicking “Add Page”:

From here, add images, copy, and call to action buttons to this page to turn it into a landing page.

If you have a specific template you want to use, navigate to the Template section on the right, and click on the drop-down menu to pick the one you need.

You can optimize your Shopify landing page for search engines by using Shopify SEO features such as the search engine listing preview. 

Use Liquid to create a custom page (coding required)

If you know Liquid or have a budget for hiring a developer, you can create a custom Shopify landing page template from scratch. 

Liquid is an open-source template language created by Shopify and written in Ruby.

However, if you don’t have the skillset (or time!) for this, it can be extremely difficult to create a functional landing page for your store this way, so we recommend...

#cta-visual-pb#<cta-title>Create better landing pages<cta-title>Your Shopify store could be driving more conversions with the right pages—start building them today.Try Page Builder today

The easiest way to create and customize a Shopify landing page

For especially custom pages that go beyond what's possible in Shopify alone, we’ve got you covered!

Shogun Page Builder has everything you need to create beautiful landing pages that convert like crazy.

Once you connect Shogun with your Shopify store, you can drag-and-drop a custom landing page together in just a few clicks. 

First, access the dashboard and choose the type of page you want to create.

The next step is to decide whether you want to build your landing page from scratch. If so, click on “Blank Page”. (Or you can select a template).

Next, start building your page using the drag and drop editor. 

The section element is a great place to start, as you can structure your landing page and build it vertically.

You can add more elements as you need them into the sections, like text, images, buttons, opt-in forms, and call to action. 

These sections act as containers which makes it easy to visually segment information on your landing pages. 

Shogun offers a selection of elements that you can place in a particular section with a single click. 

For example, adding a button element:

You can also use the Column element to create multiple content modules within a particular section.

This allows you to build horizontally as well as vertically which helps to reduce the page length while still displaying the most important information. 

There is a variety of other elements including Slide, Table, Video, and more. 

You can also optimize your landing page for SEO by setting your landing page’s meta fields.

It’s also worth noting that with Shogun’s Page Builder, you can easily add various product details onto your existing Shopify landing pages, like:

  • A product gallery
  • Product variants
  • Product quantities
  • Customer reviews
  •  Add to Cart button

And more!

Customizing your existing pages like this means you won't need to replace product pages with brand new landing pages each time you want to add something to your store, which can get quite tedious otherwise. 

There is also the option to use pre-made templates, which can be useful if you find it difficult to start building a landing page from a blank canvas.

Name your new landing page and also choose the landing page format. This will remove the header and footer from your page’s design.

Once your custom landing page is done, all you need to do is click “Save” and “Publish” and it will go live on your integrated Shopify store. 

How to build a special offer landing page: A video tutorial

Creating a landing page for sales is a powerful way to keep your messaging on-point and your audience specific. Here, we show you how to build a landing page for a limited-time deal.

Our top 3 tips for successful Shopify landing pages

Overall, no matter how you’re going about customizing your Shopify landing pages for your store, here are three key things to keep in mind:

  1. Use just one call to action (CTA) per page. Make sure you’re guiding the visitor towards one specific action. You can have several CTA buttons but you should only have one CTA on any given landing page. 
  1. Focus on the benefits. Don’t emphasize just the qualities or specifications of your product—emphasize how it will make the customer’s life better. What’s in it for them? Focus on that in both the headline and the copy of your landing page. 
  1. Make your CTA button prominent. Don’t leave the potential customer wondering what they should do next once you have presented your lead magnet or your product. Tell them what to do. Have a huge call to action button that’s impossible to miss. Better yet, have several. 

Now, there’s much more to landing page conversion rate optimization than the above tactics, but if you implement the above correctly, you’ll be on the right track.

#cta-visual-pb#<cta-title>Create better landing pages<cta-title>Your Shopify store could be driving more conversions with the right pages—start building them today.Try Page Builder today

Michelle Deery

Michelle Deery is a writer and strategist for B2B SaaS companies. She writes content that helps brands convert visitors into paying customers.