⚠️ Wisepops does not provide support for this advanced feature. Custom properties must be configured by someone with developing skills. If you don't have a technical person or agency who can help you with this, we recommend reaching out to an agency specialized in marketing data. You can find our certified partner directly here.
Introduction
Custom properties allow you to target your visitors using properties that you set up yourself - for example visitors who are older than 25, are interested by "travel" or "sport" and purchased something at least three days ago.
In these examples, the age of the visitor, their interest or their past history of purchase are called Custom properties. In this help article, you will learn
How to define Custom Properties
And how to use them to customize the targeting of your campaigns
1. Custom Properties
There are several ways to define custom properties in Wisepops:
Using JavaScript (detailed below)
Through Shopify app (selected properties available out-of-the-box)
1.1. Defining Custom Properties
You can use JavaScript to attach custom properties to a visitor. A function wisepops() is available as soon as our code is executed.
wisepops("properties", customProperties, [options]);"properties": String that indicates that you want to define custom properties. Leave it as it is.customProperties: This is the dictionary of properties you know about the user, like email, name, age, etc.options: Optional settings object to configure the properties' behavior. Currently, only support thetemporaryoption (false by default). See Persistent and temporary properties.
Typically, when someone logs in, we will add the following code, right after the Wisepops setup code:
wisepops("properties", {
firstName: "Boris",
country: "FR",
age: 30,
segments: "cinema,food,travel",
lastPurchaseDate: "2017-05-02T15:52:01+02:00"
});
1.2. Persistent vs. temporary custom properties
By default, the custom properties are persistent. After defining them on one page, they're still available on the future pages and sessions. If you define again some custom properties, they're merged with the old ones.
The temporary option allows defining properties only for the current page. The temporary properties are automatically cleared when the page is changed. This is useful to provide context that's relevant only for the current page. Like the price of the product being viewed.
Temporary properties take the precedence over persistent properties. If a temporary property and a persistent property share the same name, the value of the temporary property will be used. But the persistent property will be back on the next page.
To define temporary properties, add the temporary option as 3rd argument:
wisepops("properties", {
productPrice: 19.99,
}, {
temporary: true,
});
1.3. Custom Properties accepted Formats
Each property must be one of the following types: String, Number, Date or Boolean.
1.4 Nested Custom Properties
The custom properties dictionary is flattened into a one dimensional object. If you set the following properties, you will then be able to write conditions on the keys user.id and user.name:
wisepops("properties", {
user: {
id: 42,
name: "Boris"
}
});1.5. Date type and format
You can set up a property to the current date of the browser by entering the following:
wisepops("properties", {lastPurchaseDate: new Date()});
But you are also free to write dates as strings. While various formats are handled, we suggest you follow the W3C standard: 2017-05-02T15:52:01+02:00. This is equivalent to 2017-05-02 15:52:01 CEST. If no time zone is specified, dates will be handled as UTC.
1.6. Debugging and troubleshooting
We suggest you define your custom properties just after the Wisepops setup code. The definition of the custom properties must happen within 100 ms after the execution of our setup code. Otherwise, the resolution of the scenarios will occur without the update on your properties.
If the wisepops() function is not defined, please make sure that the Wisepops setup code is executed first, and is up-to-date. It should start with (function(W,i,s,e). You can also test your configuration.
2. Using custom properties to target your Wisepops campaigns
You can also use the custom properties you defined below to personalize the content of your popups and notifications on the fly. Follow this article to learn how to do that.
2.1. Popups targeting
To define custom conditions in your popups' targeting, open your popup in the builder tool and click Display rules. Then, select Advanced. You can configure your conditions in the Custom properties section (or Shopify properties).
To create the property in Wisepops, click on Add rule:
Type the name of your property and click on Add property.
Then you can set up the conditions to be matched during the display scenario resolution, as shown below.
Note that you need to manually type the property name the first time you want to use it. After having clicked in the dropdown, type the property name:
2.2. Notifications targeting
After setting up custom properties, you can use them in the Targeting step of your notifications' campaigns. Type property name in the first input, select rule and type value you would like to match by
2.3. Important note on Negative conditions and non-existing properties
It is important to note that the following conditions:
Is not equal to
Does not contain
will be matched only for an existing property different from the tested value. If the property is not set, the condition won't pass.
Let's take an example: product.categories does not contain shoes. Here, we assume that you want your campaign to be displayed for the products that do not have the category shoes.
And that you don't want the campaign to be displayed on pages that are not about products. If instead, we want the campaign to be displayed either if the property is different from the tested value or if the property is not set at all, we can refine the condition like this:
3. How to test your Custom Properties
This guide was written for Chrome users. If you're using a different browser, contact us and we'll prepare a guide for you.
Step 1: Open the page that you want to test.
Step 2: Hit F12 to open the developer tools and select Console.
Step 3: Paste the following text into the Console and hit Enter.
wisepops('log');
Step 4: Click on the dropdown arrow next to message. Then click on the dropdown arrow next to properties.
Bingo! You've found your custom properties.
