Custom Placeholder

Creating a custom placeholder

To create a custom placeholder you need to create a separate file that you can use as the src for the script or iFrame of you content.

Below you will find a basic structure for a placeholder:

placeholder.html

Step 1

Create a HTML file in your web project called placeholder.html

Step 2

Copy the code above and add your custom styling within <style> tags. Alternatively you can add a <link> tag to a CSS file of your choosing.

Note: It is possible to change the text of the placeholder. However if the user is not informed correctly about what they are accepting the placeholder can become non-compliant with the GDPR

Step 3

Now we need to change the source attribute of the iFrame for the embedded content:

Change the src attribute of the iFrame which you are embedding to data-src. Add the attribute data-trucookiecontrol. This attribute has to be set to the corresponding category. For example "social_content".

Your code could look similar to this:

<iframe data-trucookiecontrol="social_content" data-src="[...orginal source]"></iframe>

Step 4

Now all we have to do is add a src attribute that links to the custom placeholder. Make sure the src attribute leads to the placeholder.html file we just created. The TRUENDO placeholder templates accept multiple attributes:

  • domain You can enter the name of you business or of your website URL here. This will be displayed in the placeholder.
  • category_name The written name of the category, like: "Social Content" for the category "social_content"
  • category_id The ID of the cookie category which you have selected for the embedded content, like: "social_content"

The above attributes need to be added as query parameters to the URL of the iFrame.

Example: src="https://www.example.com/placeholder.html?domain=truendo.com&category_id=social_content&category_name=Social%20Content"

The result should look similar to this:

<iframe data-trucookiecontrol="social_content" src="https://www.example.com/placeholder.html?domain=truendo.com&category_id=social_content&category_name=Social%20Content" data-src="[...orginal source]"></iframe>
Important Note: Content that falls under the necessary category should not be changed as these can run without consent.