The anatomy of a product page that sells, from top to bottom

Your product page gets the visit and loses the sale. The shopper looked, scrolled a little and left, and you cannot ask them why. A product page that sells answers a stranger’s questions in the order they come up, so walk down yours from top to bottom with this list beside you.

Open your best-selling product on your phone before you start. That is the version of the page many of your buyers see.

The top of a product page that sells: title and photos

The title should say what the thing is in the words a buyer would type into a search box. A clever name alone tells a stranger nothing. Put the plain description next to it: the brand name, then what it is, then the detail that matters most, such as size or material.

The photos do the job that picking the product up does in a shop. A buyer wants to see the whole product on a clean background, the product in use so its size is obvious, a close-up of the material or finish, and whatever comes in the box.

Check today: cover the text with your hand. Could a stranger tell from the photos alone how big it is and what they get? If not, you know which photo to take next. In the admin, open Products, pick the product and add it under Media. Keep the files a sensible size, because heavy images slow the page, which our guide to Shopify store speed covers.

Price, and what is included

The price should sit close to the title, and the buyer should know exactly what it buys. One item or a set? Which size? Is the accessory in the photo part of the order? Every doubt here is a reason to leave and check a competitor.

If you show a crossed-out higher price, it must be a price the product really sold at. In Shopify that field is called Compare-at price, and a made-up number in it is a lie the buyer can often sense.

Say what delivery costs here too, or where it becomes free. Baymard Institute’s research on cart abandonment finds that the most common reason shoppers give for leaving is extra costs that appear late in checkout. The product page is the earliest place to remove that surprise.

If a stranger has to guess what they get, what it costs in total or when it arrives, the page is not finished.

The buy button and what sits near it

The add-to-cart button should be the most visible thing on the screen: one strong color used for nothing else, full width on a phone, with plain words on it. Options such as size or color go directly above it, and a sold-out option should say so before the click, not after.

The few lines around the button are the most valuable space on the page. Use them for the three things a buyer wonders at that exact moment: when it ships, what delivery costs, and whether they can send it back.

To add them, go to Online Store, then Themes, click Customize, and choose the default product template from the menu at the top. Shopify’s free themes include blocks such as a line of text or a collapsible row that you can drag under the buy buttons. The Shopify Help Center has the steps for your exact theme.

A description that answers objections

Many descriptions only list features. A good one answers the questions that stop a purchase. Write down what a doubtful buyer would ask, then answer each in a line or two:

• Will it fit, or work with what the buyer already owns?
• What is it made of, and how long will it last?
• How is it different from the cheaper one?
• How is it used and looked after?
• What happens if it is not the right one?

Lead with the two or three answers that matter most, in short paragraphs, and fold the rest into collapsible rows so the page stays easy to scan.

Delivery and returns deserve plain words, not a link to a legal page. Say how fast you ship, how long delivery usually takes, what it costs, how many days the buyer has to return the product and who pays for the return. Write only what is true for your store, and make sure it matches your policies under Settings, then Policies.

Reviews, related products and bundles

Reviews help only if they are real. Collect them from real orders, show the bad ones along with the good, and answer them. If you have none yet, hide the review section instead of showing a row of empty stars. Never write your own, never buy them, never copy them from another site.

Related products and bundles belong below the description, where they help instead of distract. Show what goes with this product, not a random row of bestsellers: the refill, the matching piece, the set that saves the buyer a second order. Shopify’s own Search & Discovery app lets you pick those by hand. We cover the pricing side in our guide to raising order value without discounts.

On a phone: the sticky add-to-cart

On a phone, the buy button scrolls out of sight within a swipe or two. A buyer who reads your description to the end and is finally convinced then has to scroll all the way back up.

A sticky add-to-cart fixes that: a slim bar with the product name, the price and the button that stays at the bottom of the screen once the main button is gone. Some themes have it as a setting. If yours does not, it is a small job for a developer. Check that it never covers the text or your chat bubble.

These parts are easier to design in from the start than to bolt on later. If you would rather have the page designed and built for you, that is part of our done-for-you store, which includes custom design and help with copy and graphics.

What to do first, today

Take your best-selling product and your phone. Go down the page once, as a stranger, and write a yes or a no next to each of these:

1. The title says what it is.
2. The photos show size, detail and what is in the box.
3. The total cost, delivery included, is clear before the cart.
4. Shipping time and returns sit next to the button.
5. The description answers a doubt, not just lists features.
6. The buy button is always within reach.

Fix the first no before you touch anything else. A product page that sells is not always the prettiest one. It is the one where a stranger never has to guess. If visitors still leave after that, our list of why visitors leave without buying covers the rest of the store.