Build a Custom Theme for WordPress at WSU

While we try to account for many possibilities in the Spine Parent Theme, there will always be cases that require some customization. Here’s a guide to determining if a child theme is needed and how to get started when it is.

Edit CSS

If the desired customization can be achieved solely through CSS, we recommend using the Custom CSS plugin, which is available to site administrators on every WSUWP site. CSS entry can be accessed via Appearance -> Edit CSS in the dashboard. Once CSS is added and saved, an additional stylesheet will be loaded after the main Spine stylesheet and the Spine Parent Theme’s stylesheet.

Custom JavaScript

If your customization also requires a small amount of JavaScript, it may be possible to apply to your site through the Custom JavaScript plugin. This is not immediately available to all sites, though can be enabled on a case-by-case basis. Reach out to the web team in the WSU Web Slack or during Open Labs for more information.

Using a child theme

If more complex JavaScript is needed, HTML structure needs to be changed, or if you’d just like better management over the theme through a proper, version controlled environment, a child theme can be setup.

We encourage starting your project with the WSUWP Spine Child Theme Skeleton, which provides a base for starting and maintaining a theme. Two important things are a part of this child theme skeleton.

First, PHP_CodeSniffer is used to help ensure that the WordPress PHP coding standards are properly applied. Using the command grunt phpcs in the project directory will generate either a success message or a list of code standards to fix in the theme code. Passing these code standards checks is a required element of a child theme that includes PHP code.

Second, Grunt tasks are included to concatenate CSS files from the css/ directory and then run Autoprefixer and CSSLint on the final CSS. Using the command grunt in the project directory will build the final style.css of the child theme. This step is completely optional, though will hopefully be useful to you.

Deploying a child theme

Our deployment process prefers that the child theme is available in a public GitHub repository. Ideally, this repository is part of the WSU GitHub organization to allow for effective collaboration. Once fully configured, all releases tagged using semantic versioning will automatically deploy to the WSUWP platform.

If you’d like to get setup or have any questions, please reach out to the web team in the WSU Web Slack or during Open Labs.