Visual Anatomy of a WP 1.5 Theme

This visual aid relies heavily on Ryan Boren's post Anatomy of a WordPress Theme and several Codex articles, like Theme Development, Templates, Template Hierarchy etc.(see also the whole section titled Templates and Themes from the Blog Desing and Layout chapter of the Codex).

The only purpose was to put together the info from the links above for a visual display of the templates system in a WordPress theme.
To get an idea of the structure of your WP site displayed follow the outline of the BLUE html tags in:

1. header.php <html>
<head>
</head>
<body>
<div id="rap">
  <div id="content">
2. index.php     <div class="post:>
      <div class="storycontent"> </div>
      <div class="feedback"> </div>
    </div>
3. (comments.php)
4. footer.php   </div>
5. sidebar.php     <div id="menu"> </div>
6. footer.php
(again)		 </div>
</body>
</html>

There are more DIV tags in any actual index.php, but for the sake of simplicity only the most important divs were included here.

HEADER TEMPLATE

Other Templates - used to replace the index.php
CSS File/style.css
#body{
  width:...;
  bgcolor:...;
  color:...;
  font:...;
}

#rap {
  width:...;
}

#content {
  width:...;
<html>
<head>
WP and meta tags.
<style>
... link to stylesheet
</style>
</head>

<body>
  <div id="rap">
<!--rap starts-->

        <div id="content">
       <!--content starts-->
MAIN TEMPLATE header.php
SINGLE POST TEMPLATE
<?php get_header(); ?>

THE LOOP
<?php the_content(); ?>
(it will also show the comments!)

<<?php get_footer(); ?>
single.php

PAGE TEMPLATE
<?php get_header(); ?>

THE LOOP 
<?php the_content(); ?> +
customized tags, HTML, etc. for your Pages

<?php get_footer(); ?>
page.php

ARCHIVE TEMPLATE
<?php get_header(); ?>

THE LOOP +
if is_month
if is_day
if is_category
if is_search...etc.
<?php the_excerpt(); ?>

<?php get_footer(); ?>
archive.php
If a permalink is clicked, the Main Template will be replaced by the single.php template (if exists*) showing one single post, and the comments will also be displayed.





When a page (Codex terminology: Page) is viewed this template will be used instead of the Main Template*.
Note. It can call for a different sidebar.php or no sidebar at all - or can be customized in many ways. It is possible to create more "page templates" with different file names and they can be chosen from the Write Page admin panel's drop-down menu.





If an archive link (month, calendar) or category link is clicked, or a search result displayed, the Main Template will be replaced by the archive.php template*. Usually it displays only the excerpts, not the whole post!
<?php get_header(); ?>  

THE LOOP STARTS
<?php if (have_posts())..etc.

date
<div class="post"> <!--post starts-->
storytitle - Permalink
   <div class="storycontent">
<?php the_content(); ?>
   </div>
   <div class="feedback">..</div>
</div>                <!--"post" ends-->

<?php comments_template(); ?>

 






 

 

navigation (next-prev.)

<?php endif; ?>
THE LOOP ENDS

<?php get_footer();








COMMENTS TEMPLATE
php php code

Comment 0 - 1 - %

Comments listing

Comment form
comments.php
index.php FOOTER TEMPLATE
Beside the templates on the far left a theme can have many other templates, like:

home.php
category.php
author.php
date.php
search.php
404.php		       </div>
<!--content ends-->

<?php get_sidebar(); ?>

  

 

 

  </div><!--rap ends-->
</body>
</html>
SIDEBAR TEMPLATE
<div id="menu">
all the menu lists:
pages list, categories, archives,
calendar, meta
</div>
sidebar.php
footer.php
________________

Notes:
* if these files don't exist in the theme, other files/templates will be used - see Template Hierarchy in the Codex

If the comments (comments-popup) template is missing from your theme, the default wp-comment.php (popup) will be used.