Adding Custom HTML Codes

With the JENTIS Code elements, you can use JavaScript code snippets that activate client-side (on the frontend, effectively on the user's device). This is a powerful tool in itself, but what if my requirement is a bit more "straightforward" HTML? Copy-pasting the markup code into JavaScript will not work. However, we have a workaround coming for you.

Prerequisite

Let's assume we have an HTML tag that must be implemented on our website. The following might be a possible candidate:

<script type="text/javascript" data-key="1" src=https://cdn.example.com/deliver/some.js async></script>

The idea here is to transpose this markup to a simple and readable JavaScript pendant that will paint such an element to your frontend website. This is effectively the same as just copy-pasting it to a tag management solution (where the input possibly was "Custom HTML").

Transposing HTML to JavaScript Code

Go to the JENTIS "Server Tag Manager: Codes" section to implement a new code element.

(Click "Add New Code", give it a name, and paste the following code into it)

With the magic of JavaScript, we can create the same HTML element with the following code:

// create the script tag
let scriptTag = document.createElement("script");

// set the attributes for the script tag
scriptTag.setAttribute("type", "text/javascript");
scriptTag.setAttribute("data-key", "1");
scriptTag.setAttribute("src", "https://cdn.example.com/deliver/some.js");

scriptTag.async = true;

// Append the script tag to the head
document.head.appendChild(scriptTag);

So any attribute from the "<script ...>" is set via "setAttribute('name', 'value');". You can adjust this section according to your requirements. If your HTML element has different and/or other attributes, you must add the corresponding lines of code, just like the other "scriptTag.setAttribute" function calls—line by line. Further, the last line of code "document.head.appendChild()" will make sure the according element is painted to the site, and hence the user's browser will load the according source you just defined.

Adding an IMG-Tag

If the element you want to add is not a "<script..>" tag but an image, you only must adjust the "createElement("script")" to "createElement("img")". Further, you'd need to append this element to the body (not the head): document.body.appendChild(...). Et voilà!

We hope this little workaround will help you create all the necessary elements.