[Note: The style that follows is what I would consider "somewhat conversational American English". Please feel free to edit at will to fit the overall needs of the Theme Developer Handbook introduction.]
[Note: It might make sense to put the "Your First Theme" section just underneath the "Getting Started with WordPress Theme Development" introduction text to give new theme developers an immediate sense of accomplishment for making their first theme.]
[TODO: Introduction Text]
If you'd like to develop themes for the public—either free or paid—one of the first things you'll need to get acquainted with is the GPL. It's the license that WordPress itself runs on and is governed by, and it's what has allowed openness and sharing to thrive so strongly within the WordPress community.
In short, the GPL proposes four fundamental freedoms to its users:
- The freedom to run the program, for any purpose.
- The freedom to study how the program works, and change it so it does your computing as you wish.
- The freedom to redistribute copies so you can help your neighbor.
- The freedom to distribute copies of your modified versions to others, giving the whole community a chance to benefit from your changes.
User freedom is an important aspect that goes into developing WordPress themes for the public. [TODO: expand this paragraph a bit to illustrate that the same freedoms WordPress developers and users have to open up a theme like Twenty Fourteen and examine it are the freedoms that we as developers also grant to the users and developers who choose to download and use the themes we've developed for the public; not quite sure how to word that.]
More reading on the GPL:
- Themes are GPL, too
- Q&A: WordPress & GPL
- GNU General Public License, version 2
- GNU General Public License, version 3
- The Four Freedoms
Successful WordPress themes are successfully tested themes. At a minimum you should be able to test your theme locally before releasing it to a client or the public. This means using a program like XAMPP or Varying Vagrant Vagrants to set up a suitable system environment on which to install WordPress and develop your themes.
It's a standard practice for themes to support at least two WordPress versions back; so, for example if the current version of WordPress is at 3.9, then you should also ensure that your theme works well in versions 3.8 and 3.7. Bookmarking the WordPress Roadmap page will come in handy for accessing older versions of WordPress.
WP_DEBUG is a constant that will become a big part of your development toolset, as well as several other plugins and unit test data files:
Finally, it's a good idea to stay up to date on the WordPress.org Theme Review Team's Guidelines for theme submission, even if you don't plan on releasing a theme through WordPress.org.
The big idea behind setting up a proper development environment for the WordPress themes is that it's important to test, test, and test again for common use cases that WordPress themes undergo, especially in scenarios where you'll be releasing your theme to a wide audience with wide-ranging needs.
The best examples of WordPress themes developed with best practices in mind are as follows:
- Twenty Fourteen Theme in Trunk
- Twenty Thirteen Theme in Trunk
- Twenty Twelve Theme in Trunk
- Twenty Eleven Theme in Trunk
- Twenty Ten Theme in Trunk
- Underscores
If you read and study these themes line-by-line, you will, without a doubt, become one of the best WordPress theme developers in the world. The default WordPress themes, along with Underscores, have become the best examples of standard WordPress theme development practices.
At a bare minimum the only files that are needed for a WordPress theme to work out of the box are an index.php file and a style.css file. That's it. Once you start getting into more advanced development territory you'll find it easiest to break your theme into many separate files—for example header.php, index.php, sidebar.php, and footer.php—but for now let's get you up and running with your first functional theme.
Create a new folder for your WordPress theme, named my-first-theme and inside of it create a file named style.css. This is where all of your theme's styles will go, as well as a documentation block to let WordPress know that you have a theme you'd like it to use.
Any common text editor will do here; if you're on a Windows-based machine use Notepad for now and if you're using a Mac then use TextEdit.
Put the following code into your newly created style.css file:
/*
Theme Name: My First WordPress Theme
*/
body {
background: #21759b;
}Now create a file named index.php and put it into your theme's folder, adding the following code to it:
<!DOCTYPE html>
<html>
<head>
<meta charset="<?php bloginfo( 'charset' ); ?>">
<title><?php wp_title( '|', true, 'right' ); ?></title>
<link rel="stylesheet" href="<?php echo esc_url( get_stylesheet_uri() ); ?>" type="text/css" />
<?php wp_head(); ?>
</head>
<body>
<h1><?php bloginfo( 'name' ); ?></h1>
<h2><?php bloginfo( 'description' ); ?></h2>
<?php if ( have_posts() ) : while ( have_posts() ) : the_post(); ?>
<h3><?php the_title(); ?></h3>
<?php the_content(); ?>
<?php wp_link_pages(); ?>
<?php edit_post_link(); ?>
<?php endwhile; ?>
<?php
if ( get_next_posts_link() ) {
next_posts_link();
}
?>
<?php
if ( get_previous_posts_link() ) {
previous_posts_link();
}
?>
<?php else: ?>
<p>No posts found. :(</p>
<?php endif; ?>
<?php wp_footer(); ?>
</body>
</html>You're now ready to upload your new theme into wp-content/themes and turn it on.
Congratulations! You've just made your first WordPress theme.
Remember that the key here is not to get caught up in how things are done now, but to understand the guiding principles behind making WordPress themes that will stand the test of time, no matter how the code changes or the template file structure changes over time.
Most websites, regardless of how they are created underneath the hood, need common elements: headers, primary content areas, menus, possible sidebars, footers, and the like. You'll find yourself realizing over time that making WordPress themes is really just another way of making a website.
---End---