Category Archives: Theme Tips

WordPress Theme Development Tools

Posted on by Ian Stewart

Update: We’ve created a second edition of this article, with updated code samples and coverage of the latest theme development techniques. Check it out at WordPress Theme Development Tools. It’s part of The ThemeShaper WordPress Theme Tutorial: 2nd Edition.

Before we get started building any WordPress Theme we’re going to need to get our development tools in place. In this post, we’ll run through the best of the best and build ourselves a cross-platform WordPress Theme test environment that would do a professional Theme developer proud.

A Local Test Server: XAMP or MAMP

The best place to develop your custom WordPress Theme is off the web, on your home computer. To do that though you’ll need to turn your computer into a “local server”, essentially approximating the program suite on a regular web server (Apache, MySQL and PHP). This means you can install WordPress on your home computer.

Installing these separate server programs can be technically challenging but luckily for us there are a couple of free programs that will install and manage all this for us.

If you’re on a Windows computer you’ll want to try out XAMP.

If you’re running a Mac you’ll want to download MAMP. It’s what I use and it does the trick.

Continue reading →

How To Create a WordPress Theme: The Ultimate WordPress Theme Tutorial

Posted on by Ian Stewart

Update: We’ve created a second edition of this popular tutorial! It contains updated code samples, coverage of the latest theme development techniques, and more. Check it out at The ThemeShaper WordPress Theme Tutorial: 2nd Edition.

In only 11 individual lessons this WordPress Theme Tutorial is going to show you how to build a powerful, up-to-date, WordPress Theme from scratch. As we go along I’ll explain what’s happening including (for better or worse) my thinking on certain techniques and why I’m choosing one path over another. Essentially, I’ll be teaching you everything you need to know about WordPress Theme development.

Skip to the Table of Contents.

tutorial-graphic-large

Continue reading →

Using Action Hooks in WordPress Child Themes

Posted on by Ian Stewart

In this post we’ll review how to write a PHP function and go over the basic idea of how you can use Action Hooks in your WordPress Theme. We’ll take a look at a practical example of injecting a Welcome Blurb into your Theme without touching the existing code and we’ll also look at how to remove existing content being injected into Theme Hooks.

Packing Up A Function

Action hooks are in a lot of WordPress Themes nowadays. There’s a good reason for that but you’re probably wondering what the big deal is right? They’re such a big deal because firstly, they’re incredibly easy to use and secondly, because they’re extremely powerful.

If you want to get started with them we’re going to have to take a look at how to write a PHP function again. Don’t worry, we’ll keep it pretty simple.

Continue reading →

Using Filter Hooks in WordPress Child Themes

Posted on by Ian Stewart

In this post you’ll learn to take advantage of Filter Hooks in your WordPress Child Themes. Filter Hooks are an essential weapon in your WordPress Theming arsenal. With them you’ll have almost complete control over the HTML created by your WordPress Theme—without touching any template files.

Warning: things will get a little technical on this one but hang in there—you’re about to become an expert in this stuff.

Continue reading →

Modular CSS in WordPress Child Themes

Posted on by Ian Stewart

In this post you’ll learn how to leverage modular CSS in your WordPress Child Themes by looking into another directory with @import or the <link> tag. We’ll be making a Child Theme called Chiron that will use the modular CSS of the Thematic Theme. A theme you can use as the basis for further customization—and for following along with future posts in this series.

You’ll also get a brief introduction to the concept of using Filter Hooks in your theme—something that we’ll be looking at more closely in a later post.

Continue reading →

WordPress Child Theme Basics

Posted on by Ian Stewart

In this post you’ll learn all the basics of WordPress Child Themes: WordPress Child Theme file structure, how to make any WordPress Theme a blank framework, how to import Parent Theme CSS styles, how to override Parent Theme styles, and how to override Parent Theme Template files. You’ll also learn that all of this is incredibly easy and within your grasp and that it might just change how you think about WordPress and Theme development.

Continue reading →

WordPress Menu Tricks

Posted on by Ian Stewart

In this post I’m going to show you how to take WordPress Menu Editing to the next level. You’re going to learn how to use Primary and Secondary menus in your WordPress theme; Add descriptive sub-title links to your menu items like some popular WordPress themes and sites; Filter the menu of a WordPress theme; Add special CSS classes to wp_page_menu; and finally, how to hand-code your own WordPress menu for the ultimate in control.

Here’s how to make your WordPress menu jump through hoops.

Continue reading →

Take Complete Control Of Your WordPress Menu

Posted on by Ian Stewart

I don’t normally post lists of plugins but for the first time ever my WordPress menu is completely controlled by WordPress itself in a smooth and efficient way. All thanks to some awesome plugins that you need to put in your WordPress management arsenal—right now. No more custom coding. No more hurried hacking when I change themes. Install these 3 plugins and stop worrying about your WordPress menu.

Continue reading →

Customize Your Posts Without Touching Your Theme Files

Posted on by Ian Stewart

I hate editing my WordPress theme files—and I’m a theme developer! It makes it a pain to update the theme when a new, better version comes out. And if you ever change your theme you’re either going to forget about some crucial edit you’ve made, or spend wasted hours hunting down all your customizations. Didn’t we decide to use WordPress because it was so simple to use?

Well, it is simple to use. The secret is to write a quick plugin. The really big secret is it’s not that hard.

Continue reading →

Adding Class To The WordPress Page Menu

Posted on by Ian Stewart

Problem: You need to add a class or id to the the unordered list in wp_page_menu. Maybe to implement some super-slick drop down page menus. But! That <ul> tag is trapped inside of wp_page_menu. What are you going to do?

Solution: Filter wp_page_menu. In the code example below we’ll use preg_replace to find the first—and only the first—<ul> tag and swap it out for <ul id="nav" class="something-classy">. Just drop this code snippet into your theme’s functions.php file and you’re set.

// Add ID and CLASS attributes to the first <ul> occurence in wp_page_menu
function add_menuclass($ulclass) {
return preg_replace('/<ul>/', '<ul id="nav" class="something-classy">', $ulclass, 1);
}
add_filter('wp_page_menu','add_menuclass');