Chapter 2 Design Converting Shopify Product Pages with Pagefly Shopify Page Builder

The PageFly Shopify page builder extension gives the user complete control over every page on the site. This of course includes the product pages, and the application is loaded with conversion-increasing elements and page templates all built into an attractive and easy-to-use interface. In this article let’s take a look what necessitates a great product page, and how you can start building your own today.

Scroll down to watch the video tutorials at the end of this chapter. Click here.

Let’s begin by taking a look at a standard Shopify product page:

shopify-store-guide-chapter-2-3

This is a demo Shopify product page from the Debut theme, the introduction theme that every new merchant begins with. It definitely has an attractive design and the necessary features, but is it really that exciting? This product page has:

  1. Product name
  2. Product price
  3. Add to Cart button
  4. Product description
  5. Social Icons
  6. Product image

The standard pages with the bare minimum just won’t cut it these days. E-tailers need to get more creative and engaging wherever possible. 

The product page is often right near the bottom of the ‘ol sales funnel – the point which visitors will decide to take action and go through with the purchase or not. If you’ve managed to persuade a potential buyer to wade this far into your site, the point where they are actually viewing a product they are personally interested in, you certainly do not want to leave them dissatisfied with a lack of information or trust.

Now let’s take a look at a step up from the basic Shopify product page:

shopify-store-guide-chapter-2-6
Image Source: websitebuilderexpert.com

This product page has a very similar layout, but there are some obvious improvements upon the previous one.

  1. Dynamic product images displaying the shoes from many angles
  2. The price is the price, can’t get too crazy with that, just make sure it’s clearly on display as it is here
  3. Variation is huge. Customers might be drawn to the initial image from collection page, but they might find a style they prefer even more, and in the best case scenario they might purchase more than one of a single item
  4. Add to cart button, also a given. A single-click “buy now” button can also be good for converting
  5. Customer ratings are hands down the most persuasive factor in any shoppers decision-making process. Visitors will naturally trust other buyers as there is no incentive for them to up-sell the product. Increase your brand credibility by showcasing happy customers with 5-star reviews.
  6. There are three points here: the size chart, wish list, and a limited-time free shipping offer. These go a long way in reassuring and compelling the customer.

So we’ve seen a basic product page, and an improved product page, but there’s still plenty of room to go further. The product page doesn’t only need to have what we’ve seen so far. It can be used to continue telling the story and capture the attention and imagination of your visitors even further. I’ll show you what I mean:

shopify-store-guide-chapter-2-10

This is a Shopify product page on steroids. There is a lot going on here, but all of it has its place and function on the page. The videos are super informative and make the page more interactive, the story about the production process turns the page into a learning experience, and the partner logos and FAQ go a long way in building trust. There are a lot of options for sure, so it can help to separate the absolute necessities from the “should” or “maybe” have features.

The Crucial Features of a Shopify Product Page

The above example was designed with PageFly to demonstrate the great variety of elements available and how they might appear or function on the page. Putting any clutter aside, here’s a short list of what absolutely must be on any Shopify product page (in no particular order):

  • HQ images
  • Product name
  • Price
  • Informative description
  • CTA (e.g. “Add to Cart”) button
  • Customer support indication
  • Social proof*

*For brand new stores or products this may not exist, but the page should make it clear why not.

Seems pretty bland, right? There’s nothing unique or inspirational about these features, and any online shopper is basically hardwired to expect them at this point. So making sure you play on their emotions and guide them (even better without them realizing it!) towards a decision.

Features to Consider for a Great Shopify Product Page

The most important thing is that the product page matched your brand and does not overwhelm the visitor. To bring up the above Bearie Store example again, that page has a ton of great features but is so lengthy that it almost feels as though you’re being bombarded with information.

Perhaps just the production process video would convey the brand and speak to the visitor enough, maybe it would only take the partner logos… There’s no way to know for sure without trying different things and understanding who your customers are and how to connect with them. Thankfully there are many options available to you:

  • Colour and size swatches: allow the visitor to view the options
  • Affiliate logos: reputable brands make clients believe in you more
  • Dynamic images: don’t just show one boring angle
  • Variations: are there distinctions between products beyond just colour and size?
  • Video: tell a story, highlight the production process, or entertain the visitor
  • Brand stories: everything on the product page should be brand appropriate and inform visitors even if they might have missed your homepage or about us page
  • Unique facts, features and specifications: what makes the product stand out?
  • Helpful links: give advice to your customers and it will keep them coming back
  • Similar or complementary product suggestions: always take the opportunity to up-sell or cross-sell
  • Affiliate logos: brag about your well-known partners
  • FAQ: promote transparency and be helpful

To put these features into perspective, I’ll share with you a few examples of awesome, engaging product pages.

Luxy Hair

I recently read about Luxy in another article and had to take a look for myself. The first thing that stands out is that when following the “shop hair extensions” CTA from the homepage, we’re greeted by a choice that wouldn’t really make sense in any other industry, but encourages us to interact and participate in the process of finding the right product.

shopify-store-guide-chapter-2-2

Pretty neat that it immediately feels like we are really designing the final deliverable.

shopify-store-guide-chapter-2-7

This product page includes variations, trust markers, reviews, video, and FAQ, and even a gallery where customers can share images of themselves using the product.

Sixty-nine

This brand has some serious attitude. They feel simultaneously raw yet polished, with animated GIFs instead of images for each collection and some very interesting imagery. The brand appears to rely heavily on its progressive, quirky and unique style. You can tell by looking and reading that they have really identified their target market and the customers certainly buy into feeling as though they are a part of the Sixty-nine movement.

shopify-store-guide-chapter-2-4

The images are awesome. Also the highlight here is the interesting copy, it really encourages customers to actively promote and become an ambassador of the brand. This product page also has video, social, and specs.

Leesa

This mattress company has some monster product pages. This example is honestly more stacked than the Bearie Store example from earlier in this article. Leesa makes use of the entire list of possibilities with the addition of affiliate marketing (referral incentive), financing options, discounting and up-selling. There is honestly so much going on on this product page that I need you to see it for yourself.

shopify-store-guide-chapter-2-1

Perfect Keto

The keto diet is a massively popular health trend that involves cutting out carbohydrates and consuming mainly naturally healthy fats and protein. This diet is totally marketable due to the cultural influence it has had. The product page goes the informative route, choosing to go into detail about the product, the effect of ketosis and how to get the best results. They’ve included video and an FAQ, with a comment /review section for customers to contribute to at the bottom.

shopify-store-guide-chapter-2-5

Master & Dynamic

If this company shipped to Vietnam, they would have earned another customer in me after viewing their site. Their product page is breathtaking, really. It starts minimal, showing off the incredible design of their headphones, then delves heavily into the technical specifications and features. The selling point here is obviously the high standard of design and engineering, and they’ve done a great job of showing that with each element of their product page.

shopify-store-guide-chapter-2-9

Harry’s

shopify-store-guide-chapter-2-8

Harry’s product page has some great features and makes good use of visual storytelling. For continuity since our last article, we will be recreating Harry’s product page using PageFly in the video accompanying this article.

What Should the Goals of your Shopify Product Page be?

It’s evident from these wildly different examples that there’s no secret formula for creating a great product page. The best steps to take are to add the necessary elements from the list above, then make sure it matches your brand identity. From there, it’s about experimentation and optimization; figuring out what speaks to your visitors and also satisfies you as a merchant in how it represents your company.

The ultimate goals of an amazing converting product page look something like this:

  • It subconsciously persuades visitors
  • The design captures and commands attention
  • The visitor is not left with any lingering questions
  • Your brand’s story and reputation are clear
  • Up-selling, cross-selling, and/or reselling

So have some fun with it. Start simple and build, trying new things as you go. The best part is that PageFly can help you build the product page of your dreams with incredibly user-friendly tools and amazing templates and examples to help get you started. It’s time to try building your own today!

This article also includes a video tutorial on how to recreate Harry’s product page using the PageFly Shopify Page Builder. Check it out for a great introduction to the tools and features within the extension so you can become a master page builder yourself.

[Video] Building Your Shopify Product Page

Part 1

PageFly elements used in the video:

Part 2

PageFly elements used in the video:

Part 3

Learn more about how to make your mobile responsive

One more thing…

Remember Steve Jobs’ s iconic line: “One more thing..”

We too, have one more thing to offer, to help you effortlessly boost traffic and drive sales by building reviews and social proof, strengthen your business credibility and brand authenticity.

How? We’ll hand you to trusted hands.

Try out all PageFly features with Free plan

.myshopify.com
Don’t have Shopify store yet? Create store
×