March 19, 2017
How to Code HTML to WordPress - Part 3
Part three of my screencast series "How to Code HTML to WordPress" I opt to get our Gulp task runner plugin as a result of some
CSS snags that come up.
WordPress unfortunately generates some mark up when using its built-in methods and functions. While these are configurable, they sometimes work against your workflow. I found this out first hand in Part 2 and decide I better get the Gulp.js the original author of the HTML theme created rolling.
To implement Gulp in our theme I needed to edit some files and directories to include the necessary folder paths and plugins.
The First Half
The Last Half
The last half of the video is dedicated to making the content inside the header portion of the theme dynamic. It is updated inside WordPress and configurable by the end-user.
This video is optional
If you want to bypass the Gulp.js route and write vanilla
CSS that's perfectly fine. You can skip the first half of this video and just write your styles inside the
style.css file. You won't be able to nest your styles like I do but feel free to experiment!
Personally, I like to write
Sass and figured many others might to so I extended the theme to offer support for it. The final source code will be the result of what I have implemented in this video so if you get stumped, lost, or just want to skip ahead feel free to download it.
Installing and Using Gulp
If you are new to gulp check out these links:
- Getting To Know Gulp
- How I Prepare a Design for WordPress Development
- How I Use Gulp.js In My Web Development Workflow
The Series So Far