Configuring Wingify SmartCode for Your Website’s Cookie Consent

This article covers the following: 

• Overview 
• Prerequisites 
• Where to Access the Feature? 
• Things to Remember 
• How to Enable Wingify to Detect the Cookie Consent Status? 
• Options for ‘Completely Block Wingify’ 
• Options for ‘Partially Block Wingify’

Overview

Tracking visitors is crucial for enhancing their experience on your website. However, it's purely dependent on visitors’ consent. Wingify honors this effort by providing the facility to align with your cookie consent settings.

By nature,

• Wingify tracks conversions and visitor behavior when the visitor understands the need for tracking and provides consent.
• Wingify does not track conversions and visitor behavior when the visitor declines to consent.

However, not all visitors respond to the tracking request. Sometimes, they ignore it and continue. In such cases, based on your business requirements, you can configure the Wingify SmartCode to enable or disable tracking, allowing changes to be applied without tracking if needed.

For example, if your tracking request banner features a notification that proceeding further into the website would be deemed an acceptance, then you can configure Wingify SmartCode's behaviour to align with your tracking criteria when consent is pending.

NOTE: A visitor's explicit consent status is considered ‘pending’ from the moment they land on the page until they provide a response.

Prerequisites

The Cookie Consent Manager added to your website should be updated to whitelist the first-party cookies mentioned here. Alternatively, if your cookie consent manager supports regular expressions (regex), add the following two regex to whitelist the cookies:

• _wingify*
• *_vis_*

Where to Access the Feature?

To configure the tracking behaviour of Wingify when the tracking request is kept pending, perform the following steps:

1. On the main menu, go to Configurations > Websites and Apps > select your website.
2. Under the Code tab, you’ll find your Wingify SmartCode in HTML mode.
3. Under the SmartCode section, check the EnableCookie Consent checkbox.

4. The Cookie Consent Manager section appears. The dropdown lists supported cookie consent managers. Based on your selection, the corresponding code to control Wingify behavior according to cookie consent will be auto-filled in the Configure initialization based on cookie consent editor field below. From the dropdown, select the cookie consent manager that your organization uses. 

   Note:

   • Wingify attempts to detect the cookie consent manager on your website when it is first added. If detected, the corresponding option is auto-selected in the dropdown the first time.
   • The Cookie Consent Manager option is available under both Advanced Cookie Consent Handling and Basic Cookie Consent Handling sub-feature offerings. However, the functionality differs:
     • Advanced Cookie Consent Handling: All configurations can be managed directly through the Wingify dashboard. No additional code needs to be added to your website.
     • Basic Cookie Consent Handling: This option is disabled, and Other is selected by default in the dropdown. You must manually implement the required code on your website to handle Wingify behavior based on the visitor’s consent state. Refer to Wingify Pricing & Plans for more details.
5. If your cookie consent manager is supported, you can configure the consent manager directly from the Wingify dashboard by selecting it from the dropdown. In this case, it is recommended that you update the value of the category field (or a similar classification field) of the cookie consent manager to ensure Wingify functions as expected when a visitor provides consent. For example, in the screenshot below, the category is set to ‘marketing’. This ensures, when a visitor provides or declines consent for marketing cookies to be tracked, Wingify functions as expected. Other customizations are available but optional. No changes are required on the website to handle Wingify behavior based on cookie consent.
6. If your cookie consent manager is not supported, select Custom from the dropdown. In this case, you must manually add the required code in the Configure initialization based on cookie consent field below it. This handling is applied within the Wingify dashboard, you do not need to add it separately to your website.
7. If your use case cannot be achieved using the available default options or custom handling, select Other from the Cookie Consent Manager dropdown.

8. When Other is selected from the Cookie Consent Manager dropdown, you must manually add the required code to your website to manage Wingify functionality based on visitors’ cookie consent. For more information, see How to Enable Wingify to Detect the Cookie Consent Status for the 'Other' Option? 

   The Configure initialization based on cookie consent field is non-editable when Other is selected from the cookie consent manager dropdown.

9. By default, Wingify’s behaviour and data collection based on cookie consent status is applied to Wingify Insights. To apply it to Testing, Personalize, and Rollout, turn on the Enable Advance Cookie consent options toggle. 

   Note:

   • This option is enabled by default in accounts where the Enable Cookie Consent setting was turned on before the rollout of the Advanced Cookie Consent Handling sub-feature.
   • Wingify Insights starts collecting data only after the visitor accepts the cookie consent.
10. Under Manage Wingify behaviourwhen cookie consentis pending, select an appropriate option from the dropdown:
    • Completely Block Wingify
    • Partially Block Wingify
    • Do not block Wingify See the table below for more details about each option.

Things to Remember

• If a visitor initially declines the tracking request but accepts it later, Wingify will only start functioning from their next visit. Any actions performed during the period when tracking was declined will not be tracked, and no campaigns will run during that time.
• Campaign live preview respects cookie consent settings, showing messages accordingly:
  • "Cookie consent rejected" when consent is rejected.
  • "Waiting for cookie consent" when completely blocked and consent is pending.
• Your campaign’s direct preview link will ignore the cookie consent configurations.
• When a Wingify campaign spans multiple domains/subdomains, its functionality based on cookie consent depends on the specific configurations set for each. Therefore, if you need to implement a cookie consent popup in a domain/subdomain where you’re running Wingify campaigns, you should register each domain/subdomain individually in Wingify.
• Ensure the prerequisite is met, with priority on _wingify_consent. This cookie records visitor consent for Wingify, setting 1 for consent and 0 for denial, determining if Wingify can operate. When "Partially Block Wingify" is selected and consent is pending, essential tracking data is stored temporarily to ensure tracking accuracy upon consent approval.

How to Enable Wingify to Detect the Cookie Consent Status for the 'Other' Option?

To ensure Wingify respects a visitor’s cookie consent preferences, you must include the appropriate code snippet in your website’s source code at the relevant points where consent-based functionality is configured. You can implement this as follows:

Use a single numeric value to represent the visitor’s overall consent status. This value applies to both Insights and Testing.

While applying the code, replace <number-value> with the corresponding value based on the visitor's consent status:

• 1 for Accepted
• 2 for Pending
• 3 for Rejected 

If you want to enable Wingify to detect an acceptance, modify the code as follows:

<script>

window.Wingify = window.Wingify || [];

window.Wingify.init = window.Wingify.init || function(state) { window.Wingify.consentState = state; };

window.Wingify.init(1);

</script>

Similarly, if you want to enable Wingify to detect a rejection, modify the code as follows:

<script>
window.Wingify = window.Wingify || [];
window.Wingify.init = window.Wingify.init || function(state) { window.Wingify.consentState = state; };
window.Wingify.init(3);
</script>

Options for ‘Completely Block Wingify’

By default, the Completely Block Wingify option is applied to your Wingify SmartCode, which will also entail the following options:

Cookie Consent Detection Timeout

When a visitor arrives on your webpage and hasn't responded to the cookie consent prompt, they will be served the original web page content. You can configure a timeout duration for Wingify to apply the appropriate variation based on the visitor’s response.

If the visitor does not consent within this set threshold, Wingify will not apply any campaign changes, ensuring a consistent and uninterrupted user experience (UX).

Note:

• Configuring Cookie Consent Detection Timeout is optional.
• If the Completely Block Wingify option is selected and no timeout is set, Wingify does not create any cookies.

Enable Blurred Background

If your campaign involves visual changes, you can opt to blur the webpage content until they respond to the tracking request. To implement this, select this option and specify the CSS selector for the cookie consent popup. This ensures that only the content of the webpage is blurred, keeping the consent popup visible.

This feature ensures that Wingify can apply the appropriate content variation after the visitor’s consent for tracking while preventing any flash of original content.

The blurred background will be removed immediately upon detecting the visitor's cookie consent response, whether accepted or rejected, or when the cookie consent detection timeout period expires.

Options for ‘Partially Block Wingify’

The Partially block Wingify setting lets you control which Wingify campaigns are shown to visitors before they grant cookie consent.

It allows you to select specific campaign types to display upon page load. This provides the flexibility to:

• Maximize test exposure for non-personalized campaigns (like A/B tests)
• Keep campaigns that rely on user data (like Personalization) hidden until the visitor accepts the cookie consent.

To configure this setting, follow the steps outlined below:

1. From the Manage Wingify behavior when cookie consent is pending dropdown menu, select Partially block Wingify. This action reveals the Manage Campaign Change Visibility Before Consent section. By default, all campaign types are selected. 

   Note: Checkboxes for specific campaign types will appear disabled if the corresponding Wingify product is not active on your account. This setting can be modified once the product is active.

2. Clear the checkbox for any campaign type that you want to prevent from displaying to visitors before they grant cookie consent. For example, if you clear the Split URL checkbox, campaigns of that type will not be shown to visitors until after they have accepted the cookie consent. Campaign types that remain selected (checked) will display their visual changes to visitors immediately. Wingify will only start tracking visitor data for any campaign after the visitor grants consent.
3. Click Save to apply your configuration.

When you save your configuration, the Wingify SmartCode updates its behavior immediately. Visitors to your website (before granting consent) now see campaign changes only for the specific campaign types you selected. Additionally, campaign changes for unselected types are hidden until the visitor accepts the cookie consent.

Need more help?

For further assistance or more information, contact Wingify Support.