If you really need to customise the HTML and CSS and you have someone who has some advanced skills in this area, then it's possible to Customise your Webdadi Website quickly and easily. You can preview any changes before publishing them as well, so you have peace of mind that you won’t break your Website!
In order to create Custom CSS using GTM here’s what you should do.
Create a new Tag, name it and choose the Tag Type Custom HTML
The following code is an example that you would type into GTM’s Tag HTML pane:g.
<style id="custom-styles"> .cms-page-header-image+.cms-content { margin-top: 0; background-color: bisque; } </style>
If you want to copy some CSS that you have already created and tried out using Chome’s dev tools then all you need do is
first Select the Element where you have some custom CSS.
Move your mouse over to the dev tools ‘Styles’ box that contains your CSS element styles for the selected element, Right Click the element name and select Copy Rule.
Paste the now copied CSS rule between the <style></style> tags above.
3. Save it
4. Add a Trigger that fires only for a specific page to run your CSS or add a CSS Selector where if you want to override or include your new CSS. So you can trigger your CSS to fire on a specific Page or for a specific CSS Selector event like a Click to execute your CSS.
5. Save your Trigger and now Preview your work
If you simply want to add pure HTML like a new DIV to a page on your Website or even to an item, in order to perhaps trigger a third-party code snippet, or to work with your new CSS, then you should add your HTML to the page using Webdadi’s VIA CMS. If the DIV is blank or empty, just remember to add a space using the HTML within the HTML block, so that the HTML is not ignored or removed due to there not being any content. If you want your HTML to specifically be added using javascript or jQuery then you can do this also using a GTM custom HTML Tag, putting your code between <script></script> tags.