Administrative, Business, Technology and Society

My Site Improvements

22 Comments

For those curious about the differences between the out-of-the-box TwentyFourteen theme, and my child theme, I’ve done the following:

  • Changed header and sidebar backgrounds from black to dark gray.
  • Changed all instances of all caps to capitalized first letter.
  • Switched from the sans serif typeface “Lato” to Georgia.
  • Moved meta data from top to bottom of post.
  • Added time stamp (without seconds) to the post date, and the word “by” in front of post author.
  • Increased size of blog title.

Most of these involved style sheet changes, which will be preserved if I have to do a theme update, but a couple (adding time stamp and moving metadata) necessitated changes to the template and tag files in the parent theme. But they’re minor, and can be redone if needed.

One thing I’d still like to do, but have been unable to so far, is to change the color of the blog title from white to the same green as the search box. Not sure why a color change in the CSS won’t do it. I can change font size, but not color.

22 thoughts on “My Site Improvements”

  1. “One thing I’d still like to do, but have been unable to so far, is to change the color of the blog title from white to the same green as the search box.”

    Which CSS class are you modifying to try to change the color of the title? It appears that you would use the “.site-title” to modify this, but since your site title is also a link, you may need to add two sub-classes: “.site-title a” with “color #41a62a” and “.site-title a:hover” with “color #ffffff”

    See also: the main twentyfourteen style.css entries for “.entry-title a” and “.entry-title a:hover” (though you want the entry-title hover color for your primary color on the Site Title, from what I’m reading).

    HTH.

      1. I was a little surprised that IE has a method for exploring CSS and enabling/disabling individual CSS pieces, otherwise I wouldn’t have had any clue at all where to start looking, beyond my cursory understanding of the page source and HTML/CSS inheritance rules.

        It’s extra frustrating because you can change the size and font in this section, but that’s only possible because your “a” style in the parent CSS has “font-family: inherit” and “font-style: inherit” in it.

        Specifically, the lines to add to your twentyfourteen_child CSS would be:

        .site-title a {
        color: #41a62a;
        }
        .site-title a:hover {
        color: #ffffff;
        }

  2. The page looks nice. I preferred the reply count and other data up top but that’s a minor point and I’m only one vote.

    1. Ditto, so two votes. But minor for me as long as you’re able to keep mobile disabled (if you still are, as I think you said a day or so ago).

        1. I will say that that was the most annoying thing about the old page……popping into mobile without being asked.

  3. The color of your title is being governed by line 872 in style.css. It is setting a:hover to color: #fff, which overrides everything else apparently. You can either add a class to the anchor tag, or set an inline style to change the color.

  4. I feel like an earlier “Doctor” walking onto the set of a new “TARDIS”.

    “You’ve re-decorated!? I don’t like it…”

  5. I like how it looks on my phone, except that the blog title does not word wrap.

    As I write this, the blog title background is grey, but the sidebar background is black. This is both on my phone and on Firefox in Windows.

  6. Rand, the changes are terrific improvements! Readability much better.

    FWIW -using FF 36.0 with Win7- the blog title is green just like you wanted. Apparently same color as search link. Looks fine here.

    When I hover over “About,” it goes from white on black to white on green, same color as search link. Is that what you wanted? Also, when I hover over the blog title, it goes from green to bright green. Was that the plan? Nice effect.

  7. Have you looked at it in Chrome? At least for me the left side column seems to be too wide, overlapping the blog body, cutting off some of the leftmost characters.

          1. I’m sorry, I forgot the little hack I put in years back to discourage hotlinking. Just entering the link should work, if you haven’t run out of patience by now.

Comments are closed.