Create the project: ✅
Create the different screens and list the cookies: ✅
Now, it's time to take care of the widget design! Push open the door to customization, enter the cookie beauty spa and make your widget as beautiful as your site 💄.
To access the widget's graphic customization settings, two options :
👉 via the side panel, then on the "Colors and style" menu
👉 via the "Customize the solution to your colors" tab
🚧 All modifications made to the widget in this menu impact all versions of your project.
1. Widget position and overlay
The first section of your widget customization interface is the Button Style section.
Under this section, you have various settings allowing you to manage:
The different customization options for the Axeptio button.
The customization of your pop-up
The drop shadow
2. Colors, Brand identity, Font
The second section of your widget settings interface is the Colors section.
Under this section, you can manage the entire color design of your widget according to four defined types: paint splash, base color, buttons and overlay.
As a reminder, the overlay is the shadow behind the contextual consent wall 😉
The various other sections allow you to change the color of each element by clicking on the small square that precedes it.
Thanks to the color palettes, you can precisely choose the desired color for each element represented.
💡 Remember to validate the color palette when you modify the color of the chosen element!
Attention, magic 🪄 you can view your modifications in real time thanks to the representation of your Axeptio widget on the left side of the settings interface.
3. Widget borders, Font sizes, Drop shadow
The third section for customizing your widget is the Widget Style section.
Its various sections allow you to modify the widget borders, its buttons and define font sizes.
Bonus! This is also where you can play with your widget's drop shadow 👻
Let your creativity run free!
Focus on drop shadow:
The drop shadow is the one behind your cookie widget when it is displayed.
You can choose to keep the default one or not have one at all:
Or even better! You can choose to customize it! That is, you can yourself define its size and color 🎨
To do this, simply select "Custom CSS shadow" and fill in the CSS box that appears.
The shadow size is defined in pixels and the color is managed within the rgba parentheses.
🌈 Tip
If you want a drop shadow that takes up the entire screen, it is: 0px 0px 0px 2550px
4. Typography choice
The fourth and final section of your widget customization interface is the Typography section.
If you don't feel like bothering with these details, let us handle it, we take care of everything 💆
Simply check the boxes "Let Axeptio load the font on the site" and we'll identify the font already present on your site and apply it to your widget (if it's a Google font or if it's already loaded on the site 😉).
And there you go!! 🎉 Now you know everything to make your widget look magnificent!
All that's left is to publish it 💪 But before that, come take a quick look at the other features of your back office 👉 🎁
