CSS, Themes and Customization

Creating a child theme

That looks pretty good for a start. Next, I’m going to create a child theme before making any other changes. This is rather technical and not required but it’s recommended for various reasons as explained in the WordPress codex entry.

Having created the appropriate folder and files, it’s a simple matter to activate the new theme. There is no image associated with it yet so I’ll go ahead and take a screenshot and place it in the child folder per this page.

Refreshing the page and voila, the new theme is active and working fine. Time to test the CSS editor just for grins. Changing the background color is trivial and working fine (although using the example from W3Schools is quite ugly it gets the point across):

uglycss

Standard
Plugins, Themes and Customization

Twenty Sixteen test drive

Time to check out “Twenty Sixteen” and see if I can get past that link on the homepage logo with reasonable effort. Easy enough: search for the theme, install it, activate it:

2016

Sadly, there is no easy editor for custom CSS or JavaScript. Playing with some plugins and most of them are just come-ons for a premium version but Potent Plugins has both a CSS and JS editor available free and completely functional. While there is a large banner at the bottom of the window, these look like they will do the trick:

CSSEditor

I’m happy enough with the status of the site appearance for now. Since I don’t really have any specific design criteria right now I can play with the page layout to my heart’s content. How long it will take to get the link functionality the way I want it remains to be seen and I really hope I don’t have to dig into the PHP to make it happen but that’s fodder for the next post.

Standard
Themes and Customization

Theme Shopping

Now that the backups are in place we can play with the theme and layout to our heart’s content without worrying about melting down the site. This is a nice canvas with which to work but definitely needs a little spiffing up. Pretty much vanilla page at this point:

LifestyleTuned

I’ve always had good luck with free themes though they can be a bit limited and frustrating when attempting any sort of customization. Case in point, the logo at the top has a self-referencing link (i.e.,  back to the homepage) which is certainly not the UX (user-experience) I want. A little Googling and poking around the code, I realize that this is a child theme for Omega and trying to find where to drop the “is_front_page” or “is_home” PHP conditional is going to be non-trivial at best and undoable at worst.

The latest, greatest default WP theme is “Twenty Sixteen” which bills itself as “A nice bold theme. Features full-bleed featured posts and featured images, a fixed header, and subtle CSS3 transitions.” The preview is not showing me much of interest but it’s a simple enough matter to install it and preview. I can re-activate the “Lifestyle” theme and all should return as it was or, worst case scenario, I can restore my backup (posts should be safe but I backed up my database using phpMyAdmin from cPanel).

Standard