Inject custom CSS for Header Titles

Hi there! Trying this again!

Would anyone know what the custom css code would be to inject copy into the header

of each specific page? I want the titles of the page to be in the header instead of below it. I also want the font to stay consistent. Thank you!

It is pretty hard to help you if I can not inspect your website and see the header's class name and other important detail.

You can inject text at the beginning of an element or at the end with CSS by using pseudo elements

#header:after {

    content: 'This is the OCA Studio main title on a page";

    font: 30px Arial, Verdana, sans-serif; 

}

This would go to your custom css panel.

But this is very bad for SEO especially that we are talking about Headings (h1-h6)

The second way would be to write a script into the Injections link > Footer panel

<script>

   const title = document.querySelector('#page h1');

   document.getElementById('header').appendChild(title);

</script>

So basically you moved a DOM element(h1) from one place to another. This is better for SEO then the first option. Of course your .header does not