Underline Page Title Word(s)

Site URL: https://www.infinix.com/landing

Hello,

I am trying to underline two words in a page title but can't seem to make it work.  The page title for the page is "How to Make Secondary Caries Go Away!"  I want to underline the "Go Away!" part only.

https://www.infinix.com/landing

Thank you,

Stephanie

1 hour ago, SSchulze said:

Site URL: https://www.infinix.com/landing

Hello,

I am trying to underline two words in a page title but can't seem to make it work.  The page title for the page is "How to Make Secondary Caries Go Away!"  I want to underline the "Go Away!" part only.

https://www.infinix.com/landing

Thank you,

Stephanie

You can add to Home > Settings > Advanced > Code Injection, choose the footer

<script>
    (function(){
        /*separate Go Away title*/
        document.addEventListener('DOMContentLoaded',()=>{
            const pageTitle = document.querySelector('#page-title');
            const titleWords = pageTitle.textContent.split(' ');
            const strongWord = titleWords.slice(titleWords.length - 2).join(' ');
            const normWord = titleWords.slice(0, titleWords.length - 2).join(' ');
            const htmlPageTitle = `<span class="normal-title">${normWord}</span> <span class="strong-title">${strongWord}</span>`;
            pageTitle.innerHTML=htmlPageTitle;
        });
    })();
</script>

<style>
    /*style for Go Away title*/
    #page-title .strong-title {
        text-decoration: underline;
    }
</style>

Let me know how it works on your site

Support me by pressing 👍 if this useful for you

My testing result

This worked great!!!!

You can delete this row or update my previous code

It 's just the result when i tested in  console.