How to Code HTML to WordPress – Part 3

Hi, My name is Andy Leverenz. I design, code, and am an author of things. Check out my agency called Couple of Creatives ( and my blog Web-Crunch (


Download the source code to follow along:


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 it’s 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
In this video, I walk you through these configurations as well as show you how to make use of Node.js and npm.

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 first half of 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(

💻 Originally published at:

💻 Check out the blog:

💡 👫 Check out my agency:

🚀 Links:
Twitter(Personal Account):

📘 Check out my book on UX Design:
“LUXD: Learn User Experience Design”

📙 Check out my book on Tumblr Theming:
“Pro Tumblr Theming”

📌 Recommended Stuff I Use to Shoot Video:
Canon EOS Rebel SL1 –
Linco Lighting Set –
Logitech HD Pro Webcam C920 –
Rode NT-USB Condenser Microphone –

💯 Need awesome web hosting? Check out cloudways. They allow me to use a variety of hosting providers and build apps with ease:

Fuente – Source

How to Code HTML to WordPress – Part 3

Necesitas ayuda con wp? Entonces WPVideo es tu sitio.
Encuentra lo que buscas entre cientos de miles de videos y experiencias personales de otros usuarios. Todos los que empezamos con wp deberíamos tener acceso a esta web, ojalá yo hubiera tenido algo así cuando empecé mi camino como webmaster 🙂
Pero ahora quiero y puedo poner esta web a vuestra disposición.
Disfrutadla 😉

Need help with wp? Then WPVideo is your site.
Find what you are looking for among hundreds of thousands of videos and personal experiences of other users. All of us who started with wp should have access to this website, I wish I had something like that when I started my journey as webmaster 🙂
But now I want and I can put this website at your disposal.
Enjoy it 😉

Publicado en Ecommerce, Plugins, Temas (Themes) y etiquetado .

Deja un comentario

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *