How to Code HTML to WordPress - Part 1

Part one of the "How to Code HTML to WordPress" screencast series begins with getting WordPress installed, a starter theme activated, and copying the bundled assets to the new theme.

The free HTML template called Resturant utilizes Gulp.js to run compilations of Sass and JavaScript code. Bundled within the Gulpfile are also tasks for auto-prefixing the CSS when it's compiled, watching files for any changes, and much more.

Studying the HTML template

The original other created a src and a dist folder. Essentially all development work takes place inside the src folder and is compiled, generated, and exported to the dist folder. For a static HTML theme like this, all is peachy. Unfortunately, introducing WordPress means more files, directories, and functionality.

I initially wanted to not worry about CSS in this series but as you'll see in the videos to come we end up having to integrate Gulp and all the other plugins you see into our theme.

What this video covers

• Getting WordPress installed
• Downloading and configuring a starter theme. I make use of Underscores.me for this.
• Copying over images, CSS, and JavaScript files to our working theme.

Following along? Download the source code:

Download the source code

Get notified

Be sure to subscribe to either my newsletter or my YouTube channel to receive notifications on future videos/content. My newsletter goes out every Sunday and I try to publish new content for both the blog and YouTube channel twice a week.

Some useful links:

• WordPress CLI
• The free template used in this series
• Getting To Know Gulp
• My Current WordPress Workflow
• How I Use Gulp.js In My Web Development Workflow

​