How blink Helps You Optimize Your Product Detail Pages

In our previous post, we discussed some major limitations with Shopify’s variants. To fix this issue and allow for sub-second load times, we wanted to create a product that supported all Shopify architectures. 

Whether merchants subscribe to the more common multi-variant setup or the more progressive multi-product setup — we’ve curated solutions to satisfy both worlds. For this blog, we are going to focus on our multi-product solution. Let’s dive in!

How do blink Product Pages Work?

These look and feel like any other product page on the internet — so let’s take a look at what’s going on behind the scenes 

blink applies the concept of a Product Template to group a series of like products. What does this actually mean? Let’s look at Day Owl, blink’s pioneer client, to understand how this works. Jump to this page and you’ll see what looks like a typical product page with several “color” variations.

It looks standard and simple, right? The answer is no. It most certainly is not standard nor is it simple.

To see the difference, click through each color swatch and pay attention to the URL in your browser bar.

Any time you change colors, you are actually reloading the page, but at lightning speed.

Every swatch represents a unique product in Shopify. Each with a unique slug and the opportunity for unique content. The beauty of having unique products instead of variants is that we’ve recreated the UX customers are used to these days — browsing color and size options of a base product all on a single page. But, behind the scenes we’ve unlocked all sorts of architecture, SEO, social, and logistical benefits by separating the variants into individual products in Shopify’s backend.

Again, more on the importance of this setup is detailed here. 

What are the Benefits of Using blink’s Product Pages?

Let's learn about all of the superior PDP features you'll unlock out of the box with blink

Now that we’ve learned a little bit about how products work within blink and Shopify, it’s time to get into all of the benefits of using this type of architecture for your site:

1. Integrate your pay over time partner and set thresholds for when this appears. For example, if you don’t want to advertise the pay over time with products that cost less than $100, blink’s CMS gives you this freedom. Here is a page that takes advantage of this conditional visibility.

2. Integrate your reviews partner and choose whether or not to display them based on ProductTemplate.

3. Group your similar products with user defined color swatches (they also accept images as shown here). Note for the nerds — you can create a library of swatches to recycle throughout all of your product lines.

4. Add a vertical slider of brand moments or product features.

5. Pull in your product description straight from Shopify. Need a different heading other than Description? No problem, you can override it in the CMS in seconds.

6. Have more details to share? Add additional information displays that are created and maintained in the CMS. Another note for the nerds — you can create a library of info sets to sprinkle throughout all of your products.

7. Need additional CTAs to help guide a defined user journey? Link to other pages or anchor to sections on the very same page, all controlled via the CMS.

8. Pull in product images from Shopify automatically with lightbox functionality. Click an image to see a modal takeover. Videos are compatible too!

In addition to all of these features, this entire setup is completely modular. Using blink, you can include any combination of these configurable options in your PDP in any order you desire. 

So far, that’s just the product module. A module this tailored built in Shopify would take a developer a full week on behalf of a merchant. blink’s product module, however, does not require a developer at all and certainly will not take a week to set up. In fact, anyone can build a product module this robust in 15 minutes or less. Day Owl’s record for building a product module by themselves is 5 minutes! Mind blowing, we know.

Now for the sub product module content 

To start, we’ll keep this piece at a high level. But stay tuned, there will be additional product updates and deep dives like these in greater detail.

It may seem shocking, but the reality is that everything you see below the fold was created by a non developer using blink’s CMS. Look on your phone too and you’ll notice some serious layout shifts. All of this possible with the responsive features and dense component library of our client facing CMS.

For someone familiar with the ins and outs of blink, building this entire page from scratch would be about 3 hours of work. Not to draw the same developer comparison, but this would take a skilled developer days to create in Shopify. Cut out the back and forth, cut the costs, and cut the noise. With blink, you can create lightning fast, highly converting product templates in a fraction of the time it takes using Shopify for your frontend.