Tag Archives: Custom

Designing Custom WordPress Theme Based on an Existing Website

 

When I decided to implement a blog for BZTech Solutions, I knew that it would be WordPress and I knew that i wanted to incorporate the blog as part of my website's look and feel. I did not know how hard or how easy it would be, however. As I wrote earlier, after I installed WordPress and set it up after viewing the Lynda.com course on installing WordPress, I took a look at Theme Matcher as a potential answer to creating my own custom theme. Instead, I chose to take one of the default WordPress themes, Twenty Twelve, and customize it based on the CSS styling and HTML structure of my website.

I began by replacing the header and footer with my own header and footer. Then I bulk imported chunks of my own CSS and put it in the style.css file. Some things worked and many more did not. I made heavy use of Firebug and Firefox to determine where style were being overridden and implemented adjustments. Finally, I took the correct approach and viewed a course on Lynda.com for creating custom WordPress themes and then deconstructed the Twenty Twelve theme and correctly modified it to create the bztechtheme. Through this process, I gained a better understanding of how the various php files in the theme worked.

I am satisfied with my new bztechtheme, but I doubt that I am finished with tweaking the theme to meet my expectations. The whole process has been enjoyable and highly educational and I recommend it to anyone who seeks to create a custom theme based on their current website design.