I’ve had quite a few questions and requests for examples in regards to my experience with responsive web design and WordPress themes. I’ve worked with WordPress frequently over the last 10 years, and I wanted to do a quick example for those asking about my experience and figured I’d just release it free. There are lots of easy UI frameworks like Bootstrap where you can whip together responsive design with virtually no knowledge of HTML5, CSS3, media queries, etc but I wanted to create a project that showed I have the knowledge to build a responsive website design from scratch without using any UI frameworks, jQuery plugins, or similar technologies – just pure HTML5 and CSS3. I also wanted to demonstrate my knowledge of coding themes from scratch into WordPress, so I broke this project down into two sections.
Coding to WordPress
Coding to WordPress is fairly straight-forward. Their documentation is long-standing and the API hasn’t really changed drastically over the years. Went smoothly, wrote several things in PHP using several action hooks and even a filter. I integrated WP Customization API so you can change the logo, header image, background color, header text colors, menus, etc via the WordPress Customizer in the admin panel. After I was finished, I did quick testing using Theme Unit Test provided by WordPress and also the Theme Check plugin recommended by the WordPress Theme Developer reference.
Overall, this serves as a quick example that I was able to throw together in some spare time over the weekend. I will most likely be following up with updates to CrankedBlue; and maybe a sister theme based on Bootstrap and/or some jQuery plugins, and maybe some WordPress custom plugins as well, just because to broaden my portfolio.
Live Demo & Download
Live demo is available here. I am submitting to the WordPress theme database, however apparently after searching, it appears the wait on review can be 6+ months. In the meantime, CrankedBlue is available for download and is licenced under GPL.