Blog

The nutrition product landing sales page. What does it look like?

The nutrition product landing sales page. What does it look like?

You have been selling nutrition products from your brick and mortar store for a long time. To sell these products you have to have a detailed consultation with the customer, educate them and outline the benefits of choosing the product. This is certainly the kind of product that requires learning and research before purchase. So now, let’s get back to your Shopify store and the product page.

The standard product page layout that comes from the default Shopify themes are quite simple. You have the product images, description, price and add to cart elements.

However, what if we want to put a video introduction there? What if we want to add testimonials or a text image block layout explaining some unique selling points of the product?

Most Shopify themes don’t have such functionality due to the limitation of the theme’s code structure. Before going into details with the solution to solve this problem, let’s analyze the product page from www.bodybuilding.com website.

The Product Page layout for Nutrition product

Let’s take a look at an example - Essential AmiN.O. Energy product from www.bodybuilding.com. From the image below you can see that it has a long form “sales page”. It’s a one of a kind of sales page that can showcase the product and has one main goal - sell the product. Looking at the whole page layout it’s quite easy to understand.

bodybuilding product page layout

So going into details, what things do we need to pay attention to?

We can see a video is coming first and there are 2 videos with the product introduction and a short promo clip.

video section of the product page

From the page building process it’s just 2 video page elements with the full width in the main area.

video page elements

So, just by dragging the video page elements you can put the video on your page built with PageFly. In our case, PageFly supports video from Vimeo, Youtube or just HTML5 video elements.

media page elements

The next section clearly shows the product itself and the way it’s executed via the image and paragraphs. From a page building point of view, there are 2 rows. The first row just contains a single image. The second row consists of 2 columns. The first column has an image with the paragraph and the second column just a simple paragraph also.

pagefly page elements

The layout for that section will look similar to the image below. The first image just gets the whole width. The second row needs to build the layout with 3 columns. The first column contains the child column layout.

three column layouts

Scrolling down the product page we discover an interesting section outlining the Unique Product features with a short promo video.

two sections paragraph and video

To build the layout marked with the green rectangle, you just need to drag the heading page element and use the layout with 2 columns. Inside the first column you put the Item List page element. For the second column there is the image page element.

And the video emphasized by the red rectangle is just one more row in the page layout with the video element. As we can see, video is used a lot because it can affect the buying decision.

two columns elements

As you may have noticed, this product has many flavors, 14 to be precise. It’s just a simple image graphic presented in 4 rows with 5 columns. But how does it look in terms of page building?

image page elements

In reality, it looks like the image below. 5 images need to be placed in the same row and that’s all. It's not really hard to build such a layout.

images page element with PageFly builder

Next, we see 2 sections with product images and paragraph text.

two sections image and text

And now, how to build actually such layout?

Indeed it’s quite easy. Just by using PageFly Shopify page builder app you can build exactly the same layout containing plenty of media rich content. The product “Amino Energy” with a green background is actually a 2 column layout with Image and Paragraph content.

And for the next section “Cafe series…” this can be built by dragging the image on the left and placing the paragraph on the right.

two columns layout page section

Connect your product page with your blog as an educational channel

One of the best things I’ve learned from the Bodybuilding.com website is that they closely connect the blog content and products at their shop. The navigation flow to the product page goes from the home page -> blog page -> product page. The article solves the problem of exercises surrounding chest workouts written by Craig Capurso.

home page with blgo list

When you visit this blog post there is valuable content educating users to do the exercises correctly. The content looks gorgeous. There are clear short text paragraphs with images and video as well. The content also includes practical advice, step by step and “voila”... there is a cross-promotional item - the product C4 Original.

blog post cross sell

Clicking on the Product Content in the blog post, I’ve been redirected to the C4 sales product page. And as you can guess, the bodybuilding.com portal built a great sales product landing page concept outlining benefits and problems the product solves.

So, in summary, it’s actually not really hard to build the right funnel and especially a product page to showcase your content and sell products to a customer. With PageFly Shopify page builder you can easily create a similar product page and content layout as this fitness portal and have a better conversion rate.

Older Post Newer Post