from design prototype to theme : how to get started
This tutorial is intended to walk you through the transfer of a given design to a WordPress theme. Please note that there is no audio and you might want to pause certain screens as I’ve tried to keep the length down and file size light. To work along, I’ve prepared the files used in the […]
We take a look at the design in hand, the prototype and its markup. Before you can work with this design, preview in browser, check the responsive layouts and menu toggles. Have a look at the files for subfolders and additional files, such as images. Then take a closer look at the markup to know […]
Let’s have a look at the vanilla theme files which will form basis for the new theme build and do one first comparison of code. Instead of the page-by-page markup, the theme code now splits our page elements across multiple files.
Before you can begin your theme build, your website has to have its content. This goes with our working method of ‘content out’ and has very practical reasons for the theme build. As webpages on our WordPress site are presented via settings, content in database and theme settings – you’ll have to prepare your website, […]
We begin our build with the CSS. First, give the new theme a name and identify it with a screenshot. Proceed to transfer the CSS to the theme file and compare/update the code.
The final step is now the longest and most involved – to compare all code and ensure it is the same structure across all files, resulting in the same mark up as the prototype. The video will show you how to start and cover the core files ~ to complete the build, you’ll have to […]