Styling blog archive and single pages

[Brent_St]

Hi,

I am having some issues with styling the blog archive.

The entry footer for the blogs on the archive page are transparent with black text. I need to edit both.

i also need to the background and font colors of the post excerpts on the archive page and the single page posts.

thanks

Brent

[jade]

Hi Brent,

This would require some CSS code to accomplish.

I tried to login to your site but the details you have included do not seem to work.

Kindly double check so that we can see your blog page.

Thank you.

[Brent_St]

Hi,

Not sure why the u/p didn’t work.

I have reset the password to the password included in the secured note.

Thanks,

Brent

[basanta]

Hi Brent,

Thanks for writing in!

Please add this code to your theme option -> CSS

.entry-footer a {
  background-color: #ccc !important;
  color: #333 !important;
/* you can change the color code*/
}

.has-post-thumbnail .entry-wrap {
 background-color: #ccc !important;
/* you can change the color code*/
}
.blog .has-post-thumbnail .entry-wrap .entry-title, .blog .has-post-thumbnail .entry-wrap .excerpt {
color: #333 !important;
}

.single-post .entry-wrap {
 background-color: #ccc !important;
}
.single-post .entry-wrap .entry-title, .single-post .entry-wrap .content {
color: #333 !important;
}

You can change the color code to match your design.

If you would like to learn CSS, I am sharing few resources that you take a look to get started with CSS and an interesting tool that you can use to speed up the development process.

I recommend you to watch following video that will help you to get started with CSS.

https://www.youtube.com/watch?v=MFR4WXiLzpc

Sometimes it can get a bit difficult to find out the right selector to be able to write the required CSS codes. A handy tool that can help you in this is Google Chrome dev tools. I am sharing the resource that you can refer to get started with dev tools.

https://developers.google.com/web/tools/chrome-devtools/css/

https://developers.google.com/web/tools/chrome-devtools/

https://www.youtube.com/watch?v=tP_kXBJWPhQ&t=200s

Thanks.

[Brent_St]

that worked great!! thank so much.

Is there n easy way to remove the tag cloud from showing at the bottom of the post both o th archive page and the single posts page?

As always your help is greatly appreciated.

brent

[nabeel]

Hi again,

You can add the following code as well to remove the tags cloud:

.blog footer.entry-footer.cf, .archive footer.entry-footer.cf {
  display: none;
}

Cheers!

[Brent_St]

that worked very well.

Thanks for the continued excellent support

[ruenel]

You are most welcome Brent.