How to Code HTML to WordPress - Part 7
Web-Crunch
Hi, My name is Andy Leverenz. I design, code, and am an author of things. Check out my agency called Couple of Creatives (https://coupleofcreatives.com) and my blog Web-Crunch (https://web-crunch.com)🤘🏻
Continuing on from Part 6 of my How to Code HTML to WordPress screencast series I begin to make the final push to my the HTML theme fully implemented with WordPress.
Two Sections to Go
In this video, I tackle two sections of the design. A review section is up first where a simple background image, heading, and review text is wired up to our home page using the Advanced Custom Fields plugin.
The final section before the footer features a contact form. For this form and for my own sanity I made use of a plugin called Ninja Forms. I really like this plugin over many other out there. The interface you interact with when creating new forms is pretty gratifying compared to others. Being a designer I appreciate that extra attention to detail.
Ninja Forms
Using Ninja Forms you can create forms to use throughout your site. I include a form on the page by defining a custom field and then propagating it with a shortcode generated from the plugin.
From there you simply echo that variable out inside your template like so:
#php echo do_shortcode($myformshortcodevariable);
After I got the form set up I went ahead and did my best to match the styles of our original HTML template. By default, the form plugin introduces new HTML into the mix so I needed to modify our styles slightly to achieve the same result.
💻 Previously published at: https://web-crunch.com/code-html-wordpress-part-7/
💻 Check out the blog: https://web-crunch.com
💡 👫 Check out my agency: https://coupleofcreatives.com
🚀 Links: Twitter: https://twitter.com/webcrunchblog Twitter(Personal Account): https://twitter.com/justalever Facebook: https://facebook.com/webcrunchblog Dribbble: https://dribbble.com/justalever Github: https://github.com/justalever Medium: https://medium.com/the-web-crunch-publication
📘Check out my book on UX Design: "LUXD: Learn User Experience Design" https://web-crunch.com/books/luxd
📙 Check out my book on Tumblr Theming: "Pro Tumblr Theming" https://web-crunch.com/books/ptt
📌Recommended Stuff I Use to Shoot Video: Canon EOS Rebel SL1 - http://amzn.to/2m3EZDH Linco Lighting Set - http://amzn.to/2mF8Shs Logitech HD Pro Webcam C920 - http://amzn.to/2mpqzBk Rode NT-USB Condenser Microphone - http://amzn.to/2mFhaG9
💯 Need awesome web hosting? Check out cloudways. They allow me to use a variety of hosting providers and build apps with ease: http://bit.ly/webcrunchhosting ... https://www.youtube.com/watch?v=i6b6sgGGt4s
326313715 Bytes