Many merchants have products or product lines that are sold more frequently during specific weather conditions. For example, a BBQ when the sun is shining, or winter clothing when it is cold. You can therefore tailor the products you display to the current weather conditions!
Several parties such as KNMI and Buienrader in fact offer structured data containing measurements (updated every 10 minutes!) of temperature, rainfall, and other properties. You can read these through Squeezely and show the relevant products for different scenarios. Note that you need to have properties (categories, custom fields, ...) already present in your product data so that you can make a distinction. The most optimal is an umbrella field, so for example “season: winter” but otherwise you can usually work with current data, for example categories “winter coat, hat, gloves” etc.
For reading the real-time weather data, we offer a custom-written code for Buienrader, which requires you to change only two values yourself: you choose one of the 50 available monitoring stations, and then one or more attributes (such as temperature) that you wish to filter on.
Define weather station and attributes
We use Buienradar's JSON data, which is quick to read and contains a lot of, almost real-time data: https://data.buienradar.nl/2.0/feed/json
To make the above readable in your browser, you can use a JSON viewer such as Best JSON Viewer and JSON Beautifier Online. Then under actual => station measurements you will see the following available stations:
Arnhem, Berkhout, Cadzand, De Bilt, Den Helder, Eindhoven, Ell, Euro platform, Gilze Rijen, Goes, Groenlo-Hupsel, Groningen, Hansweert, Heino, Herwijnen, Hoek van Holland, Hoogeveen, Hoorn Terschelling, Houtribdijk, Huibertgat, IJmond, IJmuiden, Lauwersoog, LE Goeree, Leeuwarden, Lelystad, Lopik-Cabauw, Maastricht, Marknesse, Nieuw Beerta, Oosterschelde, Rotterdam, Rotterdam Geulhaven, Schaar, Schiphol, Stavenisse, Stavoren, Texelhors, Tholen, Twente, Vlakte aan de Raan, Vlieland, Vlissingen, Volkel, Voorschoten, Westdorpe, Wijdenes, Wijk aan Zee, Woensdrecht, Zeeplatform F-3
Note: The name in the data itself always starts with “Meetstation station ‘ (measuring station), so the actual location is for example ’Meetstation Arnhem”
Then you pick the properties you might filter on in Squeezely, for each station these are the options:
stationid, stationname, lat, lon, regio, timestamp, weatherdescription, iconurl, graphUrl, winddirection, temperature, groundtemperature, feeltemperature, windgusts, windspeed, windspeedBft, humidity, precipitation, sunpower, winddirectiondegrees
In the script below you can change the desired measurement station and attributes in the first lines, in the attributes you can select several that will then appear in the same event.
Script with weather data
Google Tag Manager
This is the simplest option, you create a custom HTML tag and copy the below where you only need to change line 2 and 3 if desired. This sends an event called WeatherUpdate containing your chosen attributes. It is recommended that you fire this event/tag as specifically as possible.
<script>
var stationLocation = "Meetstation De Bilt";
var attributes = ["rainFallLast24Hour", "temperature", "weatherdescription"];
fetch('https://data.buienradar.nl/2.0/feed/json').then(function (response) {
return response.json();
}).then(function (json) {
return getWeatherData(json);
});
function getWeatherData(wjson) {
var stations = wjson.actual.stationmeasurements;
var stationData = stations.find(function (station) {
return station.stationname == stationLocation;
});
if (stationData) {
var sqEvent = {};
sqEvent.event = "WeatherUpdate";
attributes.forEach(function (weatherattribute) {
if (stationData[weatherattribute] !== undefined) {
var sqAttribute = "custom_" + weatherattribute.toLowerCase();
sqEvent[sqAttribute] = stationData[weatherattribute];
}
});
window._sqzl.push(sqEvent);
}
}
</script>
Spotler Activate personalization
This offers the possibility to make use of our geo-location filter: this way you can make the personalizations even more dynamic, for example by splitting the Netherlands into a number of regions. Your personalization will still render, so refresh it using the following CSS:
{{cssPrefix}} {
display: none !important;
}
Note: If the personalization cannot render, we won't execute the JavaScript either. So you have to select a working query selector.
Change line 1 and 2 to your own preference here:
let stationLocation = "Meetstation De Bilt";
let attributes = ["rainFallLast24Hour", "temperature", "weatherdescription"];
fetch('https://data.buienradar.nl/2.0/feed/json')
.then((response) => response.json())
.then((json) => getWeatherData(json));
function getWeatherData(wjson) {
let stations = wjson.actual.stationmeasurements;
let stationData = stations.find(station => station.stationname == stationLocation);
if (stationData) {
let sqEvent = {};
sqEvent.event = "WeatherUpdate";
attributes.forEach((weatherattribute) => {
if (stationData[weatherattribute] !== undefined) {
let sqAttribute = "custom_" + weatherattribute.toLowerCase();
sqEvent[sqAttribute] = stationData[weatherattribute];
}
});
window._sqzl.push(sqEvent); }
}
Create event fields and personalization conditions
You can see at the data overview how the weather data comes in:
To actually use it in our interface, you still need to create this field. Since it is not profile data, you can create the field as follows, choosing a numeric field for temperature and precipitation:
Then you have all the necessary data available, and you can apply it as a filter. For example:
This personalization will only show when the temperature for the selected weather station exceeds 15 degrees in the past ten minutes!