In 2015 I began working on a project that was created for me to offer my clients a cheaper alternative to the custom development work that I do for them. The project consisted of creating a WordPress theme that was dynamic, up to date in terms of design, allowed almost complete customization, and was lightweight enough that SEO would not be affected by it.
I’ve worked with premium WordPress themes countless times, and I knew first hand that the way they achieve their large customization options isn’t always done with the best practices in mind for SEO, and certainly isn’t done with much consideration for the overall weight of the site.
As a WordPress developer and someone who my customers look to as an expert, I found it too risky to just purchase a theme and then resell that theme under the banner of my business.
Instead I spent a few months creating a lightweight multi-purpose theme that I’m successfully used on about 5 websites as of now (March 29, 2016).
That theme, while not publicly available is called ThemeOne, and is currently hosted in a private repo on my github account.
Create Dynamic CSS With PHP For Your WordPress Theme
Now to get back to the main point of this series of articles, the issue I ran into with ThemeOne was that every time I wanted to create some css that would change the layout, I would have to write css pretty much manually in PHP. On top of that, I was echoing CSS all over the page which is a bad enough practice as is.
Instead of writing CSS with PHP all over the place, and doing it differently every time, I decided that it would be best to create a class that would handle writing all of my custom CSS, write browser specific prefixes for properties that require them, and output a minified string that could be saved in a .css file or in the <head> of the document.
Over the next few articles I’ll go into greater depth about how I created the class, and then how I integrated it into my WordPress theme.
Until then you can view or fork my finished css class for php from my github page.