10 Things to Know about WordPress Theme Modification

10 Things to Know about WordPress Theme Modification

I think any WordPress website owner that’s ‘tech curious’ should start doing their own theme modifications. You don’t have to be a PHP coder, you just need to know some basic HTML and have a little problem solving common sense.

Download a copy of your WordPress theme to your local desktop, and start opening the files and figuring out how everything works, using the tips and guidelines below – in addition to the WordPress Codex.

This post is part of the:
100 Things you Need to Know about WordPress Series given by Anthony Montalbano and myself at WordPress Ann Arbor.

1. Widgets enable drag and drop functionality for content or plugins (usually sidebar / footer)

This is a bit basic, but I still find that a lot of people don’t exactly know what widgets are – or how they can use them. Your WordPress theme has to support widgets, but if you go to “Appearance->Widgets” in your WP dashboard admin, you’ll see that areas that you can drag and drop widgets to. WordPress natively has some core widgets available (like pages, categories, tags, recent posts), and a lot of plugins have their own widgets as well.

2. A WordPress theme can have unlimited “widgetized areas”

The concept of widgets is simple, and most people are used to seeing widgets in the sidebar(s) or footer. What you may not know is “widgetized areas” are added by the theme developer, and you can (literally) add a widgitized area “anywhere you want”, and you can have as many as you want. The WordPress Codex page for Widgetizing Themes is a great reference.

Let’s say (as an example) that your footer wasn’t widgitized, and you wanted to be able to drag and drop widgets to it.

You would edit the ‘functions.php’ file of your theme to contain this code to register your new footer widget (of course the before and after values may vary depending on your theme):

# Footer Widget
if ( function_exists('register_sidebar') )
    register_sidebar(array(
		'name' => 'Footer Widget',
        'before_title' => '
',
        'after_title' => '
',
		'before_widget' => '
',
        'after_widget' => '
',
    ));

Then you would add this code to your ‘footer.php’ file to find and show the appropriate widget(s) when the footer is called for a page:

3. Widgetized areas can be “conditional” (for specific conditions or pages)

Sometimes you may want widget(s) to be displayed only under certain conditions. Like a widget just for the homepage, or just for specific posts or category or tag pages. This when you use WordPress Conditional Tags.

In this case you would use the same code in your ‘functions.php’ file to register your widgetized area, but then you would add the conditional statement(s) code to the area where you are calling the widgetized area in theme code. Using the previous example, if it was the footer and you only wanted to display that on the footer widget on the homepage, this would be the code:

  } else {
  }

4. WordPress 3.0+ adds custom “menu” functionality (like widgets, but for navigation)

WordPress menus (navigation menus) were introduced in WP 3.0+. Here’s the Navigation Menus page in the WordPress Codex. Much like widgets, menu areas can be added anywhere inside a WordPress theme by first registering them in ‘functions.php’ and then adding them to theme page code. You can also “conditionally” add them using the exact same methods presented in the widgetized area examples.

5. Core theme files are index.php, single.php, page.php, header.php, footer.php, style.css

Some WordPress themes are really complex, and others have but a few files. If you are ‘tech curious’, it behooves you to dig a little deeper inside your WordPress theme and see how it works. For those of you that tinker a bit, here are some brief details about some of the most important files within every WordPress theme.

index.php: The ‘index.php’ file is the default of all WordPress themes. When loading your theme, if WordPress can’t figure out which theme file to use, the default is always index.php. For instance, when WordPress loads your homepage the first file it looks for is ‘home.php’. If you don’t have one ‘index.php’ is used. For archive pages WordPress looks for ‘archive.php’ – if your theme doesn’t have one it defaults to ‘index.php’.

single.php: The ‘single.php’ file is what is used for all posts within your WordPress web site. If you want to permanently add something to all posts sitewide, this would be the theme file to edit.

page.php: The ‘page.php’ file is the one that is used in your WordPress website to display all static paged pages (like your About page, Contact page, etc.). If you wanted to modify all your static pages sitewide,this is the file you would edit.

header.php: Generally speaking the ‘header.php’ file is for the basic HTML code that starts all webpages in your site, in addition to the display of the top portion of your page. You could modify the header of all pages sidewide by editing this one file.

footer.php: The ‘footer.php’ is the reverse of the header, it’s for the bottom of all pages and also the closing HTML code for each webpage. You can modify the footer of all pages sitewide by changing this one file.

sidebar.php Your theme may have more than one ‘sidebar.php’ file (or it could be called something slightly different), but generally speaking the sidebar is for your right/left sidebars within your web pages.

6. You can create custom headers, footers, and stylesheets to be used in certain conditions

Once again I’ll take you back to WordPress Conditional Tags. Using a conditional tag statement in your WordPress theme code, you could actually create and use multiple headers, footers, and even stylesheets in your WP theme code.

Let’s say as an example, you wanted a different header for the homepage than the rest of the site (like we do).

This is very simple, in your index.php do something like this:

Then all you have to do is save your 'header.php' file as 'header-home.php', make the changes you want, and upload it to your theme directory. You can do the same with your footer, sidebars, stylesheet, etc.

//retrieve only specific pages

 'page',
	'post__in'  => array( '595', '33', 44 )
);
$the_query = new WP_Query( $args );
?>

//display posts by author

$query = new WP_Query( 'author=123' );

//display posts by several authors

$query = new WP_Query( 'author=2,6,17,38' );

//posts from a specific category

$query = new WP_Query( 'cat=4' );

//posts for a specific tag

$query = new WP_Query( 'tag=cooking' );

query('showposts=3');
?>

have_posts()) : $recentPosts->the_post(); ?>
	

   
   

            
            


                
                

Filed under:
                
                | 
                0) Comments','(1) Comment','(%) Comments'); ?>