My first Didomi Element

Before starting to create your own preference center, let's make sure everything is properly setup.

Paste this in the head of your page :

<script type="text/javascript">
window.didomiConfig = {
containers: [
{
id: "my-first-container",
components: {
activeComponents: [
{
id: "introduction-text",
type: "text",
options: {
content: {
en: "Congrats! You are displaying your first Didomi Element"
},
style: {
default: {
color: "#265973",
fontSize: "25px",
}
}
}
}
],
layout: [
{
id: "introduction-text",
type: "text"
}
]
}
}
]
};
</script>

Then paste this HTML code where you want the preference center to be displayed inside your body tag :

<didomi-container id="my-first-container"></didomi-container>

If you see a blue text saying "Congrats! You are displaying your first Didomi Element". You are good to go to the next step. If not, please make sure you properly included the Didomi SDK on your page and paste the 2 sections of code in the right place.