Wordpress Theme Development Journal

posted: category: web-design

Wordpress Theme Development Journal

Entry 1 - Gathering Resources and Tools

Have you gotten tired of browsing through WordPress themes trying to find the one that best matches the look and design you are trying to achieve? If so, at some point, you have probably wondered how difficult it is to make your own WordPress theme. The truth is, making a WordPress theme can be fairly simple and straightforward or incredibly complex, depending on your knowledge of WordPress, PHP, and JavaScript and also on what information you would like your WordPress theme to grab from the database of your website.

I am currently working on creating a WordPress theme from scratch and plan on detailing the entire process. As I learn what needs to be included, you will benefit from learning from my mistakes. In the end, this will also make a handy how-to guide on how to create your own WordPress theme. Without getting complicated, I will make these entries as straight forward as possible, providing you with source code, helpful links, and other relevant information. Now let us move on to the first entry on how to create your own WordPress theme.

Getting Started with a WordPress Theme

This first entry in my WordPress theme development journal is about getting started and gathering the necessary files. Before you can jump into creating a WordPress theme, there are some tools and resources that you should check out. There are three main tools that I use for creating a WordPress theme, in addition to online resources:

  • Latest release of WordPress
  • XAMPP Virtual Server
  • Eclipse (or your favorite editor)

To start creating a WordPress theme, I found that you will need an up to date release of WordPress. Simple enough, you can download the latest package of WordPress directly from the wordpress.org homepage. For reference, my main source is the wordpress.org article on developing a theme. This contains the complete (and up to date) break down of what is needed to create a theme. Visit http://codex.wordpress.org/Theme_Development and give the first page a quick read through.

In addit

ion to needing the latest release of WordPress, I setup XAMPP to create a local server on my computer. XAMPP is a free program that sets up a virtual server on your computer, from which you can run PHP, MySQL, and Perl. When creating a WordPress theme, there is going to be a lot of editing and testing of your progress. Instead of having to constantly upload files to your server, you can simply save your progress and immediately see the results in your browser. Visit https://www.apachefriends.org/download.html to download XAMPP, available for Windows, Apple, and Linux.

Installation is fairly easy, I use Windows 7 and did not have any trouble with the installation process; though, I ran into some issues when going to run XAMPP for the first time. After installing XAMPP, always run it as an administrator when starting it. The issue that I ran into was that the default port set for Apache was already in use. All I had to do to allow the program to operate correctly was change the port setting for Apache to something else. The only two aspects of XAMPP that I use are Apache and MySQL. Apache allows you to run PHP script and MySQL allows you to create a database.

Finally, you will need some type of editor for creating and editing files. Whether you use Notepad++ or any other editor is up to you. Personally, I prefer to use Eclipse. Eclipse is also free and can be downloaded from https://www.eclipse.org/downloads/

Once you have the latest release of WordPress, a virtual server (XAMPP), and an editor (Eclipse or your preferred editor), you are ready to setup WordPress locally using XAMPP. For detailed instructions on how to setup WordPress, I found the following tutorial very helpful. http://sixrevisions.com/tutorials/web-development-tutorials/using-xampp-for-local-wordpress-theme-development/

This tutorial walked me through setting up XAMPP and then setting up WordPress. Give the entire tutorial a quick glance and then follow the instructions to finish getting your test environment setup.

The Overall Concept of Your Theme

Start thinking about what you want to get out of your theme. For example, are you creating a theme for your own personal use or are you attempting to create a theme that others can download and use? Early on, I created a simple list of features that I would like to include and also listed some of the features that I have found dissapointing in other WordPress themes. Here is what I jotted down:

  • Conceptual Ideas for WordPress Theme
  • Responsive design that takes full advantage of large displays.
  • Customizable. Include options for changing default fonts and font sizes.
  • Provide a selection of backgrounds.
  • Include placement for widgets in the sidebar, footer, header, and below content.
  • Use at little code as possible.
  • What I Dislike About Some WordPress Themes
  • Bloated code that slows down page load time.
  • Not enough options or too many options. I want a balance.

Making a list of what you want to include now will help you out later on.

That is it for getting started. I figure, this is a good stopping point for this first entry, before moving on to the anatomy of a WordPress theme, as the files you need to create will require some time and thought.

Check out the next entry in my How to Create a WordPress Theme journal.

comments powered by Disqus

About the Author

Jeff K.

Jeff K.

Jeff is a web designer and graphic artist. In addition to web design, Jeff enjoys other forms of art, including pencil sketching and illustration.

If you are looking for affordable web design services for your business, Cloudy Mouse provides timely personalized service. Our focus is creating great looking responsive website designs for small businesses without breaking their bank.

Take a look at our Web Design Services and discover how we can get your business into the cloud.