Change Color of Footer to Match header image

batharoy, the asynchronous communication is working for me. No apologies needed.

I’ve made these two changes.

My next concern is the colors on the special post types (like the link type I’ve already used) is that muddy brownish orange color.

Blue color, or change to color you want.

.entry-content a {
    color: #1B8DC9;
}

batharoy–that didn’t seem to change any of the pages/posts I have up now.

The current link post type is

.format-link {
background-color: #f7f5e7;
}

(if I’m reading the inspect element information correctly. When I changed f7f5e7 to 1B8DC9 and refreshed, nothing happened. Should I have used something different? I shouldn’t have to delete and re-post, right?

Nice use of the 20-13 theme, RCC!

Did you decide on leaving that widget background color to that light tan color?

If not, in the editor under Styles, search for this code and change the RGBa values. The widget background color is not a Hex color.

.widget {
background-color: rgba(247, 245, 231, 0.7);

In Photoshop, you can find out the RGB equivalent to your desired Hex color and plug in those values. The 0.7 adjusts the opacity (I believe) from 0.1 to 0.9. Play with that and see what it does to your RGB color.

Good luck.

batharoy,

You mentioned adjusting the size of the entry title header via CSS. However, can you tell me where I can find it in the Style editor, specifically the font size for the entry title header?

.entry-title a {
color: #4F4E4A;
font-size:38px;
}

Thanks in advance.

Thanks akdmcnicoll–I’m about 85% happy with it.

I’d love to change several things though. The segment you gave me plus the blue color correction to some of the post entries batharoy gave aren’t working:

.entry-content a {
    color: #1B8DC9;
}

.widget {
background-color: rgba(27,141,201, 0.7)
}

That is, everything that’s tan now, I’d prefer to have in blue.

Finally, the widget area at the bottom, I’d love to get rid of that hideous baby-shit-brown color (apologies to the theme creator, I just hate that color) and have it be #4f4e4a (a dark grey) which would still show off the orange and white type.

I’ve learned a lot through this process–thanks to all for your help!

By the way akdmcnicoll, I quite like https://www.colorhexa.com/ for obtaining color equivalencies. You can enter what you have: RGB, CMYK, or Hex and get equivalents in 14 different schemes, plus gradients and complimentary colors.

For the baby-****-brown color:

.site-footer .sidebar-container {
background-color: #4f4e4a;
}

@akdmcnicoll

However, can you tell me where I can find it in the Style editor

You should not use the style editor unless you are using a child theme, all changes will be overwritten if the theme is upgraded. If all you are doing is CSS edits then install a custom css plugin.

If you are using a child theme just adding the code to the style.css will override the default.

@raincitychick
Will work on the link colors and hopefully have something in a couple hours.

@raincitychick:

The rgba code I gave you is not CSS. Search for .widget in your style editor (child theme, of course) and you’ll see those rgba background-color values. Replace the tan color rgba values with yours.

Thanks for the colorhexa site link. Will check it out.

As for the brown color, I just changed it in the style editor from #220e10 to #000000.

@batharoy:

Thanks for your quick reply. Yes, using child theme. I will try your CSS, but I was just wondering what it’s name is in the editor because I could not find it.

I found where to change the site-title and site-description font sizes, but not the page title/header.

Any thoughts would be appreciated.

@raincitychick

I think this covers the link color as well as the hover color, let me know if I missed something.

.categories-links a {
color: #1B8DC9;
}
.categories-links a:hover {
color: #ea9629;
}
.widget-title a {
color: #1B8DC9;
}
.widget-title a:hover {
color: #ea9629;
}
.textwidget a {
color: #1B8DC9;
}
.textwidget a:hover {
color: #ea9629;
}
.date a {
color: #1B8DC9;
}
.date a:hover {
color: #ea9629;
}
.entry-content a {
color: #1B8DC9;
}
.entry-content a:hover {
color: #ea9629;
}
.site-footer .widget a {
color: #1B8DC9;
}
.site-footer .widget a:hover {
color: #ea9629;
}

@batharoy I think I’ve got some conflicting instructions in my child theme, because the colors are not switching up as I want. I’m attending a conference, so I’ll take a hard look over the late weekend,and then post any Q’s I may have. AGain thank you!!

@akdmcnicoll
@raincitychick

Made a mistake on the entry title code above.

.entry-title {
font-size: 12px;
}