Book Image

Learn to Create WordPress Themes by Building 5 Projects

By : Eduonix Learning Solutions
Book Image

Learn to Create WordPress Themes by Building 5 Projects

By: Eduonix Learning Solutions

Overview of this book

WordPress has emerged as a powerful, easy-to-use tool to design attractive, engaging websites. Themes play a big role in making WordPress as popular as it is today, and having an eye-catching, fully-functional theme could separate your website from the rest! This book will help you take your first steps in the WordPress theme development process, with 5 different projects centered around creating unique and responsive WordPress themes. Start with creating a simple WordPress theme using HTML5, CSS, and PHP. Then, you will move on to incorporate different APIs, widgets, and tools such as Bootstrap and jQuery to create more dynamic and highly-functional themes. Whether you want to create a photo gallery theme, a highly customizable e-commerce theme, or a theme designed to suit a particular business, this book will teach you everything you need to know. By the end of this highly interactive book, you will have the required mastery to develop WordPress themes from scratch.
Table of Contents (6 chapters)

E-commerce HTML template – Part A

We'll first build a flat-out HTML template and then move on to integrating it and making it a WordPress theme. Let's go ahead and create a folder for this template, and we will call this myshop_html. Now let us download Foundation from foundation.zurb.com. Click on the Download Foundation 6 button which will take you to the downloads page. Now, click on Download Everything under Complete:

We'll now open up the downloaded ZIP file and let's just take everything out and move it to our myshop_html folder:

Now if we open up index.html with our desired web browser, we will see that we pretty much have a boilerplate:

The CSS is implemented and the JavaScript should be implemented, so let's go ahead and open up index.html in our editor. We will work through this code of index.html and replace what we need. Let&apos...