Widget settings

Serge LAKE
Serge LAKE
  • Updated

In this article, we will go over the different phases involved in using your widget so that you can adjust its settings to best suit your needs.

To do this, we'll cover how to:

  1. Define the structure of the widget
  2. Customize the widget's graphics

 

1. Define the structure of the widget

The best way to present your cookies and other trackers is to organize them into clear, meaningful categories for those who will use your pages. Too often, sites display a list of unrelated technologies and services without providing any sort of explanation. And often, the only difference is whether or not they are necessary.

With Axeptio, it's different. By design, our widget for collecting consent for cookies asks you to break down the cookies into different steps. They are presented to users sequentially so that they can make their selection ("Select" button).

The sequence of these steps provides an opportunity to tell the story of your cookies and explain their purpose.

To develop and present this philosophy, we'll go over the following topics in this article:

 

Anatomy of a cookie configuration

Within a single project, you can create multiple configurations for your cookies. Maintaining multiple configurations allows you to support multilingual versions or have separate configurations for multiple sites under the same brand (landing page, blog, e-commerce, etc.). In more advanced cases, you can also use this feature to carry out AB testing among variations to improve your consent rate.

When you use the form to configure cookies, you can change the following properties:

  • The configurations version management properties, which are settings specific to the configuration:

    1. The title is an internal title that helps you identify the configuration easily in the version list and in our statistics tool.

    2. The ID is a technical name that allows you to instruct our script to load a particular version.

    3. The widget language is a dropdown menu that lets you specify the language for which the widget is configured.

      ⚠️ Changing the language property has no impact on the texts that you've defined. The language will have an impact, however, on the "About Axeptio" sidebar.

    4. The About Axeptio sidebar is the informational text that opens in the widget when the user clicks our "Consent certified by Axeptio" signature. With this dropdown menu, you can now choose between multiple variants and match this section to your image.

      ⚠️ There is a checkbox here to validate that Axeptio is logging proofs of consent. If you do not check this box, this means that the user's choices regarding consent to cookies will not be logged in our database. You will also be unable to audit the consent statistics or download the proof log. This feature is available only for paid customers because it involves storing and processing costs.
       
  • The list of steps that will be displayed to users who interact with the widget. Each step will correspond to a large family of cookies that you group together. How these steps work will be explained in the next section, including how you can easily edit, reorder, or delete steps from the list.
     
  • Your widget's interface text. These include button labels or even link text. We are referring to interface text instead of content text, which will be set up in the forms for each step. On the page for editing interface text, you can select one of the preset options that we've written for you, which are both compliant and relevant. The texts that you will modify based on your configuration will be applied to all steps, with the exception of those whose custom text has been specified.
     
  • The properties for integrating the widget on your site. On this screen, you'll find the HTML code to be integrated into your site's pages so that the Axeptio widget loads. Other advanced options will also be available for configuration on this form, which contains several steps:

    1. The widget's display delay: This is the time that our script waits before displaying the consent widget for cookies. 

      💡 Be careful to consider the positive impact of the delay on your user's mood: If your visit statistics are your priority, you may be tempted to minimize this delay so that our widget appears when the page loads. We have found that this is a counterproductive choice that turns off users and leads to a higher bounce rate on your site.

    2. Scroll height: This is the distance the user must scroll before the widget is displayed. This option goes hand in hand with the widget display delay configured above.

    3. Hide Axeptio button: This option allows you to hide our dot, which appears at the bottom of the page once the user has made their cookie selection. Warning: If you choose to select this option, you will have to offer an easy way to make our widget reappear, such as by clicking a "My cookie preferences" link that the user can find in your site's footer.
       
  • Users: List of contributors authorized to view and change this configuration. As for most of the settings in the Axeptio admin interface, you can add multiple collaborators, who will be able to view and change the setting in question.

 

The different types of steps

We have developed three main screen types that have their own management rules and group multiple settings steps together. Let's take a look at each of them:

 

✅ To access the settings for the main screens from your back office:

  • Click the project whose settings you'd like to view
  • Click Cookie Management
  • Click the configuration you'd like to edit
  • Click New if any of the steps are not yet displayed

 

Welcome screen (1/3)

This screen type is always displayed first in the sequence of steps. It does not contain a list of third-party cookies, but is does allow you to add a link to a privacy policy.

Capture_dcran_2021-07-29__11.26.49.png


On this screen, you can set up the buttons available to the user and their behavior. Regulatory requirements for cookie consent vary by country. We maintain a summary table of each regulator's requirements to help you choose which buttons to display on your site.

 

 The settings on this screen are critical. Focus plenty of time and attention to getting it right, because this is where 99% of your users will make their selection!

Here are a few pitfalls to watch out for:

  • ⛔️ Depersonalizing the message and its appearance: We can certainly thank our sweet cookies for leading you to us, but they're not there (only) to look good. Personalizing the cookie with a friendly and recognizable avatar builds a connection and put the user in a good mood for the consent request.

  • ⛔️ Leaving it all up to your legal counsel: There is no doubt that you are meeting a regulatory obligation by displaying this message, but don't lose sight of the fact that the consent widget is a point of contact with your user (perhaps even the first) and offers a valuable marketing opportunity. Be careful to avoid unnecessarily complicated and technical phrasing.

  • ⛔️ Rushing and/or sidestepping the message: A lack of helpfulness and transparency won't earn you any favors. Not only is this a regulatory requirement, but it also garners respect from your users. And even if they don't give their consent right away, showing your cards lays the groundwork for them to give their consent the next time they visit.

 

Category screen (2/3)

This is the screen where you will (confidently) describe the services, cookies, and other trackers for which you are seeking the user's consent. This screen is designed to offer a choice for each service individually.

Capture_d_e_cran_2022-02-01_a__17.08.03.png


We suggest creating as many category screens as necessary in order to produce the most meaningful groupings for non-technical people. As with the welcome screen, where we advised transparency over opacity, we recommend a division based on each service's functional role. In other words, separate audience measurement from advertising, CRM services (chat, forms, etc.) from support services, and so on.

When you edit a category screen, you can add one or more cookies. We call them cookies in the interface to be more direct, but it's good to remember that they may take the form of a pixel, script, or piece of software.

 

✅ It is absolutely not required to specify the technical names of each cookie placed in the browser (including those you find with the web inspector). This information is of no use to typical users and diminishes the importance of the entire consent process. Instead, identify the software solutions used on your site in a clear and understandable manner:

etape_2.2.png

_gid or _ga obviously mean nothing to users. Google Analytics, however, does. Valid consent, according to the GDPR, implies that consent is collected in a clear and understandable manner, so it's up to you to explain what these cryptic IDs mean. It is also not uncommon, as in the example above, to have a single script that is responsible for placing multiple cookies. It is therefore neither interesting—nor technically feasible—to offer a single piece of information for each of these cookies.

 

Cookie selection

✅ Axeptio provides multilingual repository for the most common services. You can find it by clicking the Add a new cookie button.

We have described and categorized several hundred pieces of software that are easy to add to your setup. For each of these vendors (that's what we call them in the industry), we have identified the software publisher, provided a description in English and French, and offered a link to their privacy policy. It is your responsibility to provide users with easy access to the contact information for personal data subcontractors, the third parties who place cookies on your website.

If the service you are looking for does not appear in our list or if you would like to provide it in a language other than those we offer, you can create your own vendors. To do this, use the "Create cookie" button on the selection screen. By default, we use the service URL to get the favicon to display as an icon in the widget. Be sure to include it if you want to improve the appearance of this step on your site.

The name field is an especially important field on the form for editing cookies. It provides the technical identifier that will be sent to your website when collecting consent. That is, whether you choose an integration through a TMS (Tag Management System) or directly in JavaScript, the names of the variables used to trigger the scripts on your page will come from this field. For the convenience and sanity of the developers working with you, please avoid accented characters, spaces, and other characters that are incompatible with programming languages. (It's not that it doesn't work, but it makes the integration a little more complicated.)

Once the cookies have been selected or created, they will appear on the form. You can click them to modify their content. If you modify a cookie from the Axeptio repository, we'll create a copy when you save. That copy will be attached to your user account, your working project, and the organization associated with the project (if any).

 

✅ If you opt for Reject all and Accept all buttons on your welcome screen, a very large number of visitors will not even see these screens. Does this mean that you can be flippant about them? Not at all! The relatively few users who are motivated enough to explore the mysteries of your cookies are usually people who are aware of what happens with their data, or they may be developers who are curious for a peek under the hood (who you could even recruit...). It could even be your local data protection authority, doing a good-faith check on your site! 🤷

 

Information screen (3/3)

This is the little brother of the category screen, borrowing much of its design and mechanics.

The information screen allows you to display a list of services without requiring the user's prior consent.

With consent not required, we allow the screen to automatically scroll with a countdown. When you view the information screen, you may notice a discreet progress bar that indicates how much time is remaining before the step is complete.

 

✅ Want to skip the countdown? No problem, just specify 0 (zero) in the "Skip screen after" field.

✅ If you use a countdown, be sure that it is big enough to allow the user to read everything. There is nothing more frustrating than a screen that scrolls too quickly.

 

Summary of features on the three screen types

Screens Displays third parties Content Illustration Free access
Welcome screen No Kicker, Title, Subtitle, Text, Link to Privacy Policy To the right
Yes
Category screen Yes Kicker, Title, Subtitle, Text Middle Yes
(limited to 2 services)
Information screen Yes Kicker, Title, Subtitle, Text Middle No

 

Customizing widget illustrations

Within each step form, we allow you to change the illustration image, along with its height and width. When you click the edit button (pencil symbol), you will be brought to the general selection and custom file download screen.

✅ You can play with the height and width to create original compositions.

 

This screen has three parts:

  1. The download field: Drag a file from your computer to this box, and it will immediately be uploaded to our servers. We accept all major file types (jpeg, png, webm, and svp). For all the techies out there, the original file goes to an AWS S3 bucket in Ireland, where it is then served by our imgix CDN (which uses Fastly).

  2. The list of your previous uploads: When you upload a file, it is linked to your user account. Simply click the image to select it.

  3. The list of images that we provide: Our team has custom-made lots of copyright-free images that you may use in Axeptio widgets. We offer several design styles and add new images on a regular basis.

✅ Want to use the Axeptio style, but with an image that really suits you? We also make custom illustrations! Contact us so that we can discuss your needs.

 

Now that everything about the administration of our cookies widget is clear, why not customize it with your colors? In the next article, we'll explain how to change the appearance of widgets to match your visual identity.

 

2. Customize the widget's graphics

To customize your widget's graphics, see the following article:

 

 

 

Was this article helpful?

12 out of 32 found this helpful