The Sorbet theme has served me well for a number of years, but it doesn’t have full support for everything that the new editor introduced in WordPress 5.0 offers, so I figured it was time to move on to the new Twenty Nineteen default theme.

Twenty Nineteen is a beautiful, simple, and clean theme, but there are a few things I didn’t like, so I figured I’d share how I handled them.

Accent Color

This site has used the same shade of blue as its accent color for the past 14 years. Twenty Nineteen has a built-in color slider to choose your accent color, but no way to specify a particular shade. This is because Twenty Nineteen’s color slider only includes shades that are easily visible against the white background and black text. This is definitely a worthy reason to finally change, so I just used the slider to pick the shade of blue that most closely matched my logo.

Square Logo

Speaking of my logo, I love it, it was designed by José Marques, and keeping it contained in Twenty Nineteen’s circular crop was absolutely not what I wanted, so I added the following via Customize > Additional CSS to remove that circle effect:

.site-logo .custom-logo-link {
    border-radius: 0;
}

Props to Kathryn Presner for reminding me how to do that since my CSS has gotten a bit rusty lately.

Menu Separator

Twenty Nineteen’s menu simply includes space between items, and that just didn’t look right to me. Was “About Categories” an About page, a Category page, or was it a page about categories? This quick addition via Customize > Additional CSS added a simple separator between the two:

#menu-item-1234:after {
	content: "|";
	padding-right: 5px;
	color: #000;
}

.site-header.featured-image #menu-item-1234:after {
	color: #fff;
}

You’ll need to find the ID for the menu item that you want to add the separator after, and put it in place of “1234” above. To do that, right-click the menu item, choose “Inspect Element” (the wording will differ depending on the browser you use), and look for “menu-item-[number]” inside the source there (you may need to look one level higher or lower in the source if you don’t see it right where it drops you).

That’s all I’ve done to Twenty Nineteen so far, but I never stop messing with the themes I’m using, so I’m sure there will be more tweaks to share later on. 🙂

Leave a comment

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.