How do I change the site title color on scroll?

[JustinQuinn]

Hi all,

I'm trying to figure out how I can change the color of my site title on scroll so it doesn't blend in with the background of the navbar. I've seen countless posts similar to this before, but I'm looking to change the site title specifically and not the navbar color. I'm using the "Birdseye 2" theme, which makes it difficult to find any tutorials that are for LESS and not CSS, especially one that I (a very novice programmer) can follow. I'm hoping somebody can help me out or guide me towards someone who can. Thanks!

[BJ5]

Did you want it to fade from one color to another, or just change to the other color once you start scrolling?

[JustinQuinn]

If getting it to fade is possible, then definitely yes!

[Bernadette3]

Hi @JustinQuinn Can you please post a link to your site? It might be helpful for @BJ or anyone else on here that can help out, in case they are not familiar with the theme you are using. Thanks! 

[JustinQuinn]

Hi, sorry for the (very late) response! The website is https://cartoonisty.weebly.com/, thanks!

[Bernadette3]

No worries on the delay! I see @BJ popping in here and there. I'm sure he (or another code-helper) will see this post soon.

[BJ5]

Thanks for the tag @Bernadette. This should work for you on the published site if you put it in Settings > SEO > Header code, @JustinQuinn:

<style>
    .affix .wsite-title
    {
        color: #000 !important;
    }
</style>

It will make it turn black when you scroll and the navigation turns white.

[JustinQuinn]

@BJ Thanks for your help, but I tried pasting the code in the Header Code box in my SEO settings, but it doesn't seem to have any effect on the published site. The website is https://cartoonisty.weebly.com/ if you need to check it again. Anything else I could try or did I do something wrong?

[BJ5]

Hmm... try moving the code to Settings > SEO > Footer Code instead.

[JustinQuinn]

Just tried moving it to the Footer and it still doesn't work. Just to make sure we're on the same page, we're trying to change the color of the site title "Cartoonisty" in the navbar. Is there another bit of code that we could try instead that may work? Thanks!

[BJ5]

Oh, I see what the issue is. Try this:

<style>
    #wsite-title
    {
        color: #000 !important;
    }
</style>