Modifying text colors with the Harmonic theme
-
The blog I need help with is https://guitargentleman.com/
I am using the Harmonic Theme and would like some more consistency with the text colors. I have selected a bright white color for text on blog posts (example: https://guitargentleman.com/2016/04/26/digitech-gsp1101-review/) and would like the blog title text in the overall blog landing page (https://guitargentleman.com/blog/) to match that color rather than being a more gray color. Is this possible?
I would also like the tagline and the recent blog post titles on the homepage (https://guitargentleman.com/) to have that bright white color rather than the more faded grayish white color.
Lastly, when someone navigates from the any page to a blog post, the background of the entire page is bright white for a second before the dark gray background color is rendered. It’s nitpicky, but the drastic color change is a bit jarring. Given that the background color is just a simple HTML color and not a resource-intensive image, is there a way for the stylesheet to render the background color as one of the very first page elements and prevent the white background from initially appearing?
-
Also, is it possible to have the header image from my blog landing page (https://guitargentleman.com/blog/) appear on actual blog post pages? And possibly even my About and Contact pages?
-
Hi there, to make the blog titles white, go to Appearance > Customize > CSS, delete all the informational text in that window, and paste in the following custom CSS.
.entry-title a { color: #fff; }On the home page post titles, add the following to get them to be white.
.home .hsContent { opacity: 1 !important; }I’m not seeing a tagline, can you explain a bit more which element you are wanting to change on that and I would be happy to help.
-
On the white background on a blog post when loading, this could be difficult to address with CSS. Add this custom CSS and give it a try.
body.custom-background { background-color: #111111 !important; }On the header images for single post pages, the div where the image would be isn’t in the HTML, and there really isn’t one that we can use to put it in. On single post pages, if you set a featured image for the posts, that image will appear above the content. You can see what that looks like on this post on the Harmonic demo site.
-
Wow, thank you so much for your help! You fixed pretty much everything. The tagline is the “Home of the best guitar and bass gear reviews on the web.” line on the homepage but your CSS changed the color of that too, which is exactly what I wanted.
I’m fine with manually selecting the same featured image for blog post and I like the way it looks, but the only thing I’m not crazy about is that it looks like the blog landing page will show that thumbnail for every single blog post (https://guitargentleman.com/blog/), which also looks a bit silly since I’ve selected that image to be the header image for that landing page. Is there a way to have it not show the featured image for each blog post on that blog landing page?
-
Super!
We can hide the entry thumbnail from the blog posts on the blog page with the following CSS.
.blog .entry-thumbnail { display: none; } -
-
- The topic ‘Modifying text colors with the Harmonic theme’ is closed to new replies.