CSS, Themes and Customization

Boo Hiss Twenty Sixteen

Custom CSS is not working in Twenty Sixteen; how disappointing. Still, it was a chance to review what others have said / are saying about the default theme so it was a learning experience. Back to the theme marketplace then and more shopping.

I’m going to play with Ryu for a while; simple, elegant and appears to be highly customizable. It’s built on something called “Underscores” (or “_s” for the geeks out there) which looks fascinating in its own right.

ryu01

I’m liking it enough that I’ve gone ahead and made a child theme for it. The custom CSS plugin is working just fine. Using the browser inspection tool, we see that the post titles are styled by rules in class “.entry-title”.

The parent theme rules are:

.entry-title {
font: italic 700 68px/1 "Playfair Display", serif;
margin: 0;
max-width: 696px;
}
.entry-title a:hover {
color: #333;
}

Let’s go ahead and try styling the post titles to something a little more attractive using the anchor tag pseudo-classes link, visited, hover and active (in that exact order). The new code is:


.entry-title {
font-family:"Times New Roman", Times, serif;
font-style: normal;
font-size: 40px;
}

.entry-title a:link {
color:#000;
}

.entry-title a:visited {
color:#0f0f0f;
}

.entry-title a:hover {
color:#aaa;
}
.entry-title a:active {
color: #ff6666;
}

and a screenshot:

csstweaks

and that should just about do it for today.

Standard