Hi,
I haven’t been able to figure out how to add header and footer code. For example, I tried adding the following in html but didn’t see any header in the link. Am I doing something wrong?
style=“color:red; font-size:30px;”>HELLO TEST
(I removed the p and /p so that to avoid the automatic formatting here just to show you)
Hi @ravit ,
Yes, if you enter the following into the Header code injection area, it should work as expected:
<p style="color:red; font-size:30px; text-align: center">HELLO TEST</p>
This will display the text on the page after the custom code is saved.
Please make sure to save your changes after adding the custom code. Once saved, the text should appear at the top of the page.
Thanks! It looks like you’ve added it to a Studio page, right? I am trying to add the header/footer to a direct deployment link. I tried the code you added here and still nothing
Hi @ravit,
Thank you for clarifying. I originally tested this on workspace-level custom code, and it did work there. Different custom code fields can behave differently depending on the page where the code is being added, so the same snippet may not always appear or behave the same way across those different contexts. In some cases, simple HTML elements do not surface the way you might expect, and it may require more targeted CSS or JavaScript to place or style elements the way you want.
In general, custom code is most often used for things like tracking scripts, analytics tags, conversion pixels, custom CSS, and JavaScript that modifies existing parts of the page. If you want to place something inside a specific area, the usual approach is to inspect the page first by right-clicking and choosing Inspect, find the element you want to target in the DOM, and then use CSS or JavaScript to style it, modify it, or insert something relative to it.
So, before I suggest the best approach, what are you trying to achieve with the header or footer code? If you describe what you want to add or where you want it to appear, I can point you to the best option.
Also, if your goal is to customize the visual layout of a page more directly, another great option is to use an HTML section. That gives you a much more natural place to add HTML, CSS, and even scripts to build custom sections and unique page elements.
