View Categories

Adding a Pop-up or Size Chart to Product Pages

4 min read

Create a pop-up or size chart for multiple products at once in your BigCommerce store.
The link/button that opens the popup of the size chart type will be automatically added to all pages of the selected products. For general-purpose pop-ups, you can specify the place on the page content where the buttons have to be placed.

Open the app #

Open the app (it must be already installed. See how to install Prikid Size Charts App

To do this click on Apps in your Bigcommerce admin panel and then click Prikid Size Charts:

Adding a Pop-up or Size Chart to Product Pages 1

The main page of the app will be loaded where you can see all the size charts and pop-ups you created.

Add a new pop-up or size chart #

Depending on what kind of item you want to create, choose the appropriate tab: Size chart or Pop-ups. Below we’ll describe the process of creating a size chart, a specialized type of pop-up.

Click the Add new size chart button:

Adding a Pop-up or Size Chart to Product Pages 3

You will proceed to the first step of creating a pop-up – setting the product segment to which this pop-up will be linked.

Adding a Pop-up or Size Chart to Product Pages 5

In essence, it is a designer of conditions that you can flexibly customize. This pop-up will be linked to the product pages that meet the specified conditions.

Please note that the pop-up will also appear even for those products that you will add in the future if these products meet the conditions you set.

You can flexibly create rules for product selection using different types of conditions. For example, you can specify a list of specific products or categories, or brands. Alternatively, you can choose products that contain a word in the name. You can create combinations of conditions using AND/OR operators. You can even use regular expressions if you are familiar with them.

Creating rules

Set product selection criteria #

For example, you would like to create a size chart for those items in the Women’s T-Shirts category that contains the word beautiful.

Most likely, there are other product and category names in your store, so use them

To do this, in the filter designer, select the type of condition Product category is, specify in list in the next field

Adding a Pop-up or Size Chart to Product Pages 8

Begin typing the category name in the third field. A drop-down list of autocomplete will appear in which select Women’s T-Shirts

Adding a Pop-up or Size Chart to Product Pages 10

Now click the AND button, in the new line select the type of condition Product name, in the next field – contains. And type the word beautiful in the third field

Adding a Pop-up or Size Chart to Product Pages 12

Preview products that meet the criteria #

You can now preview the products that meet the conditions by clicking the Preview button

Adding a Pop-up or Size Chart to Product Pages 14

In our case, there are only two products that meet these criteria.

Ok. Moving on.
Click Esc to close the preview window, and then click Next in the bottom right corner.

Create a content #

In this step, you will see a content editor where you can, using different blocks, create a pop-up window’s content that will be displayed to your site visitors

Create content

To simplify this example, let’s use the template by clicking the Examples button and selecting the T-shirt size chart from the drop-down list

Adding a Pop-up or Size Chart to Product Pages 17

This action will populate your layout with sample data:

Adding a Pop-up or Size Chart to Product Pages 19

For our example, this is enough.

Save and publish the pop-up/size chart #

Click the Next button and give a name for your size chart (just for internal use)

Adding a Pop-up or Size Chart to Product Pages 21

Note: If you create a general-purpose pop-up, you’ll need to specify additional parameters at this step. See instructions

Click Save & Publish

Great! You just created your first size chart.
Let’s check if it works. As you remember we have two products that apply our conditions.

Check the size chart on the product page #

Now we can go to their public pages, and check if the size chart will appear

Adding a Pop-up or Size Chart to Product Pages 23

As you can see, the link Size chart appeared near the size selection section. Let’s click on it

Adding a Pop-up or Size Chart to Product Pages 25

Voila!
We have opened our size chart. The same thing will happen on the page of our second product.

Great job! It’s time to try it on your own!

Powered by BetterDocs

1 Comment

  1. Nate Ginsburgsays:

    Thanks a lot for the detailed guidance, I decided to test out a popup from Helpcrunch, these guys suggest free trial and customizable popups for their clients. I think it is one of the shortest ways to convert visitors into leads, I just can’t ignore it.

Leave a Reply

Your email address will not be published. Required fields are marked *