December 18, 2017

What It Takes To Make A WordPress Theme? What should you prepare before actually developing wordpress theme?

First of all let me be clear, it is not like any other tutorial on making a wordpress theme. This article in no way will teach you how to make a wordpress theme but it will try to give you the required resource that you will be needing while making your first wordpress theme. If you are already pro on creating wordpress themes than you can suggest any resource that will help beginner to get started with wordpress theme in the comment box below.

I finished my first wordpress theme- Pokhara Classic, still not perfect so I don’t have plan to sell it. I have already used that theme on Lifestohack Nepali website. That design was particularly inspired from the thenextweb website. It is just a simple and plain website, nothing fancy.

Lifestohack Nepali WordPress theme

Despite of making some basic HTML, CSS website before, I never went so deep on making wordpress themes. But For the first time I finally decided to make one. As a beginner myself I did lot of research and preparation. Now I will be giving you all those resources that I particularly used while making the theme.

What you should prepare before starting with wordpress theme development?

[AdSense-B]

HTML, CSS, JAVASCRIPT, PHP …

I assume that most of you have some idea about HTML, CSS, JavaScript and PHP. I do not think without knowing these basic things you would not dare to make a wordpress theme. You don’t have to be perfect but at least you should have some idea. If not you can refer to many online tutorials. HTMLDOG is one of the many websites that will help you get started. Knowledge in jQuery and whatever helps to make wordpress theme awesome is preferred. That is to say that what you want to include on your theme may not be achieved every-time with html, css or javascript. You need to have knowledge on some other language to achieve what you want.

Codex WordPress for theme development and Function reference

Before you start with WordPress theme you should know some basics of developing wordpress theme. Theme Development will for sure help you understand the anatomy of a theme. You will see that most of time you will be visiting this website. You don’t have to know everything on this websites but only the things you need. You will know what PHP function you will need after you actually start developing the theme and a simple Google search can redirect you to Codex WordPress for Function Reference .

Everything needed to make a WordPress theme

Localhost Server

There are many server you can download for your personal computer for development and test purposes. Xampp and Wampserver are some of them. Just get the server to work and install wordpress on it. There are tons of tutorials on it on the internet, refer to any of them.

Frameworks

Writing the whole code for the theme can take months and sometimes years, so in order to make the development time less, framework can be used. If you don’t want to use any framework, it’s up to you and if you don’t want, you don’t have to but it is really recommended. Writing everything from scratch will take lot of time and will get difficult. Even famous premium theme developers use frameworks.

There are many free and paid frameworks. You can choose the one that fits you. I personally used Bootstrap because it was easy for me to get started as everything was well documented in its website. It is an open-source, free and it is the combination of html, css and javascript code designed to help build user interface components.

You can learn more about Frameworks at Codex WordPress for Theme Frameworks. Don’t only limit yourself on the link provided but you can also search on search engines and look what you like the most.

Blank WordPress Theme

This can be optional, if you have got some idea from Theme Development page than you can do it by yourself otherwise you can download some blank WordPress theme. What it means is there is certain anatomy of the wordpress theme and you should be creating. For my part I created all the files by myself instead of downloading from internet.

[AdSense-C]

It is not that hard, just open up notepad++ or any editor and save the blank editor as header.php, index.php, sidebar.php, footer.php, functions.php, single.php, page.php and put every file on a folder{themefolder}. Now you have to put that folder on your localhost machine at wordpress/wp-content/theme/{themefolder}.

Bootstrap WordPress Paginationbootstrap pagination wordpress

Instead of coding by myself I decided to go with this Bootstrap-wordpress-pagination: a fully functional bootstrap pagination style. Bootstrap Styling, First & Last Buttoon, Next & Previous Button, Glyphicon can be added instead of Next & Pervious values, Filter to overwrite values are it’s features. You can find the tutorial on how to use it on it’s github page.

WordPress Bootstrap Navwalker

bootstrap wp navwalkerMenus option is not included on wordpress itself but you need to code by yourself on your wordpress theme and  WordPress bootstrap Navwalker just saved my time. I need to make Header, Sidebar Footer and Footer menus on my theme and this piece of code was really helpful.

Theme Option

Making a customization panel for your wordpress theme is one of the important aspect of developing theme. It makes the theme powerful and every theme has a admin panel from where you can upload the website logo and various other administrative work. There are many frameworks that you can use to build the admin panel. These frameworks attempts to bridge the gap between WordPress developers, designers and end-users by creating fully responsive option panels and meta boxes

Personally I used Options Tree UI Builder for WordPress: A simple way to create & save Theme Options and Meta Boxes for free or premium themes.But do some research and find the one you like the most.

So, with these tools I was able to make a working wordpress theme. Now tell us what tools do you use? What was the most difficult problem that you faced during the development?

About Bhattarai Diwas (thenepaltech) 213 Articles
I'm an Engineer and have Bachelor's Degree in Electrical and information technology. Right now I am working as a software developer in Germany. All in all I love programming and I am a tech geek.