Coach Theme Footer Element Colors

[Christian]

Hello,

I would like to modify the text colors of widgets added from the block builder in the global footer element – Coach Theme.

I added the following to the footer element under Appearance > Elements > Footer Template:

Latest posts, categories, archives.

These block builder widgets appear in a red color by default with dark colored hover. I would like to change the color to white with red colored hover to match current modifications to theme.

How can I change these colors as it appears I can not do so in the document and block section editor on page.

Thanks in advance,

Christian

[Leo]

Hi there,

Any chance you can link us to the site in question?

You can use the private information field.

Let me know 🙂

Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/

[Christian]

Hi Leo,

I surely can. Would it be possible for me to add you to site admin?

Please send me your email.

Thank you,

Christian

[Leo]

Is your site live?

If so can you just provide the link to start with?

We don’t need the dashboard access yet.

Thanks 🙂

Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/

[Christian]

Unfortunately, it’s still in the staging phase. just about ready to go live in a few days.

[Leo]

You can use support@generatepress.com

Please provide the login info using the private info box here.

Thanks!

Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/

[Christian]

Admin added.

thank you!

[Christian]

site url sent in private info box.

[Elvin]

Hi Christian,

I’ve checked your site.

I believe the footer is made with GenerateBlocks added on a Block Element hooked to the footer.

You should be able to style these on the Block Editor when you open the Block Element. You can also style other things from the site’s customizer.

These block builder widgets appear in a red color by default with dark colored hover. I would like to change the color to white with red colored hover to match current modifications to theme.

I’m not sure I understand completely. Can you explain a bit more?

While I see the footer with an image background with red overlay, I don’t see any widgets that are red in color with dark colored hover.

However, what I found are fonts with white color and some links with no :hover settings and widget with the default blue link color.

Perhaps you’re pertaining to this widgets with the default colors. This ones are styled on Appearance > Customize > Colors.

A wise man once said:
"Have you cleared your cache?"

[Christian]

Hi Elvin,

Yes—I am referring to the links to categories, recent posts and archives with no :hover settings and widget with the default blue link color.

For some reason I can’t style these widgets with the block editor settings in the sidebar of admin. Color setting do not appear for these widgets.

After following the steps Appearance > Customize > Colors in what tab after > Colors would I be able to change the default blue color to white?

Please advise.

Thank you,

Christian

[Elvin]

After following the steps Appearance > Customize > Colors in what tab after > Colors would I be able to change the default blue color to white?

Yes you should be able to style whatever is in the footer through Appearance > Customize > Colors > Footer.

There’s actually an option there specified for footer widgets. There’s also one for footer bars. They have their own respective link and link hover state color settings.

Let us know if that works out.

A wise man once said:
"Have you cleared your cache?"

[Christian]

Elvin,

I changed all colors to white in the footer widget section. Also, logged out and cleared browser cache. Still not reflecting any changes.

Any other things we can try?

Thank you,

Christian

[Elvin]

I changed all colors to white in the footer widget section. Also, logged out and cleared browser cache. Still not reflecting any changes.

Oh right, I’ve checked your block element, it’s a part of the block rather than added through footer widgets. It makes sense why it wasn’t working. My bad.

We can use custom CSS. You can try this:

.site-footer ul > li > a {
    color: white;
}

.site-footer ul > li > a:hover {
    color: red;
}

A wise man once said:
"Have you cleared your cache?"

[Christian]

Hi Elvin,

Thank you for researching and sharing the code.

Where should the CSS code be placed?

Please advise.

Thanks,

Christian

[Elvin]

You can put it on your Additional CSS on Appearance > Customize.

Or Child theme if you have one. 🙂

A wise man once said:
"Have you cleared your cache?"

[Author]

Posts