Back to PageFly.ioVideo Tutorials

How to create a Product page with PageFly

Overview

This guide will show you how to enhance your PageFly Product Page, offering detailed product information to elevate conversion rates. By integrating PageFly elements efficiently, you'll be able to boost your product page's conversion rate optimization (CRO) and search engine optimization (SEO) performance.

Requirements

  • Install PageFly for Free: Get it for your Shopify store here.

  • Understand the Synergy Between Shopify and PageFly: The default Shopify Product Page provides basic product information. PageFly takes it a step further by allowing you to add comprehensive details about your products, significantly improving your chances of converting visitors into customers. It's important to note that PageFly's product pages complement the default Shopify pages by enhancing them with additional content.

How To Create A New Product Page

Before diving into the specifics, watch this tutorial on creating a basic Shopify Product Page with PageFly:

Getting Started

Below is how we used PageFly elements to empower a default Shopify product page.

Step 1: Create A New Product Page

There are 2 ways you can choose to create a new product page.

  • Create from scratch:

Navigate to the PageFly dashboard, click on "Pages", then select "Create blank page". Choose "Product" from the dropdown menu to begin crafting your product page from scratch.

  • Create from PageFly’s templates:

Click on the “Create form template” option and choose “Product”.

You can filter to choose the proper templates based on your store niche. And then, hover and hit the “Select” button.

Step 2: Assign Product(S)

Once your page is set up, it's time to link it with your products.

In the Product Page Editor, access the Page Assignment modal by clicking the “Page Assignments”. Here, you can assign one or multiple products to the page.

  • If you want to assign the PageFly product page for all product pages on your store, click dropdown inside “Page Assignment” > Choose "All products" > hit "Save".

  • If you want to assign the PageFly product page for specific product pages, click the "Browse" button > Select products from the products list > Click “Select”. Remember to hit the “Save” button at the top-right.

Manage the assigned product quantity directly from the PageFly Dashboard. A quick link in the quantity section directs you to Page Assignments for easy management.

Step 3: Add Product Details Element

In the Element Catalog, click on the Element icon. On the Shopify tab, drag and drop the Product Details element onto the page canvas.

Enhancing Your Page

Step 1: Add Brand Logos Section

  1. Use pre-made sections to add a Brand Logos section.

  2. Hover to any section, then click the “+” icon , select "Template", then navigate to "Client Logos" within the category section to choose your preferred section.

  1. Change image: Click on each Image element, then go to the General tab, click on the “Select” button to choose another image for your store needs.

Step 2: Add Product Unique Selling Points

By adding a product unique selling point (USP) section that contains the product highlight feature and information, this section can help customers understand and believe more on your product and easier to make buying decisions.

You can add the USP by using premade template Product information or Product Specification category.

After adding a premade section on the page, click on each element to change content and image to suitable for your product.

Step 3: Add Customer Testimonials

It’s very important to have customer reviews/ testimonials for your store. This helps to increase trust for your store. You can use our Testimonials premade sections

  • Step 1: Click on the Plus icon at the bottom right of the section, then select Template to open the premade section library.

  • Step 2: In the premade section library pop-up, click on Category > Testimonials and choose a section you want.

Step 4: Add A Cross-Sell Section

You can use a Product suggestion pre-made section to create this section.

In the General tab, click the Custom Collection option and select a collection you want.

This helps customers see other products in your store and encourage them to take action.

Step 5: Hide Default Product Details

  • For Theme OS 1.0:

There is a product preview section above the product details. It’s a default section when you create a new product page. This is the placeholder of the product details generated by your theme. Here you can hide it in the Page Settings by untick the “Show default product details” option.

  • For Theme OS 2.0:

If you use the Dawn theme of Shopify Online Store 2.0, you can click on the More Action icon in the top right corner, then click on Go to theme editor.

In the theme editor, you will see the product detail twice, one from the theme and another from PageFly

You can hide one of them by clicking on the eye icon

You can also move the section made with PageFly freely on the product page. Click and hold the six-dot icon next to each section in the theme editor to move around.

Finally, click Save to save your changes

Tips And Best Practices

  1. The Product page should include essential product information, unique selling points, customer feedback, and cross-sell product list.

  2. Ensure product images cover all angles and incorporate lifestyle shots for enhanced engagement.

  3. Clearly detail unique selling points, avoiding lengthy paragraphs for better readability.

  4. Enable direct customer reviews on the product page to foster engagement and trust.

  5. Optimize your page for responsiveness, particularly for mobile viewing.

Frequently Asked Questions

1. Why I cannot find the product when searching for it?

In this case, in order to find the product you want, you have to type the full title of the product or type the URL and URL handle of the product. To find the URL and handle of the product, you can follow the following steps

  1. Shopify admin > Products > Choose the product you want

  2. Scroll down to Search engine listing > Edit, then you can find the product’s URL and handle.

2. What is a product page in Shopify?

Shopify product page is a dedicated web page, existing in the Shopify e-commerce system, as it shows full information of a specific product. You can now create a Shopify Product Page that is now available in the PageFly Admin Dashboard, which can be referred to ‘PageFly Product Page’.

3. How to create mobile-friendly Shopify product page?

Create a mobile-friendly Shopify Product Page using PageFly’s powerful elements and features:

Last updated

Was this helpful?