As we saw last week, designing our child themes is not going to be a piece of cake, but the configurator is actually quite good. I’ve been playing with it a bit, and I have some suggestions.
Let’s start off with a simpler theme. Zillah is available through the wordpress theme tool. It’s a bit more simple than the one we were using last week, which makes our job a bit easier.
Plan for the afternoon
- Load theme
- Customize the background image
- Create child theme
- Use the property/value tool to identify key selectors we want to change
- Use the query/selector tool to make changes
- Preview before we go live
Load theme
This is pretty easy. Go to Appearance ..>Themes..> and use the search tool to find Zillah. We’ll make it live and then do a few customizations.
Customizations
Let’s keep this simple. I’d like to put a background image behind our design, (I’m using the mountain pic we downloaded earlier.) And I’d like to see how the slider works with this. Otherwise, let’s use the default values of the theme.
Create Child Theme
We’ll go through the same steps we did last week with this one.
For step 5, I believe we’ll have to ensure we use the separate stylesheet, because of the order the fonts are loaded in the parent theme.
Changes to accomplish
- Pick a new color palette: we’ll go to color.adobe.com to do so. (I’m going to base mine off the background image.)
- New base font color
- New header colors
- New link colors
- Slight transparency on the background of the header and the posts: rgba(255,255,255,0.9)
- New background colors in the footer
- If it’s all going well, we’ll use Google fonts to pick new typefaces too
We’ll hunt down all the selectors we need to change to make this work, and preview using the theme preview tool. (We didn’t do this last week, because I hadn’t thought through the next step we’ll want to tackle, which is changing templates.)