Static Pages

This page was superceded by the inclusion in version 1.5 of the facility to create pages from within WordPress. It remains here for the sake of curiosity :)

Why use a static page ?
Maybe you want a page to write about you, or your cat, or about your blog and it's purpose, or have an image - and you want all this to look as if it's part of your blog.
This gives your site a shared layout (or 'look and feel') which many people like.
Creating a static page is fairly easy (the hardest page is always the first) but take your time, read and be prepared for it to maybe look odd until the code is spot on.
If you need to post to the forums after following this, you must give a link to your site - without any link, helping you will be very difficult.

Plugins ?

Yes, there are plugins that will do this for you:
Owen's EzStatic
TG's StaticEez
Note: the above plugins, and the method described below will allow php code to run in the page on which you use this technique. At the time of writing, the pages feature in 1.5 will not.

Gutting time !

You would use this method if you wanted your static page to have exactly the same look as your main WP page. This includes the menu.

Index.php has everything we need, all that is necessary is that some of the code is chopped out.

Here is a default 1.2 / 1.2.1 index.php:

<?php
/* Don't remove this line. */
require('./wp-blog-header.php');
?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml">

<head profile="http://gmpg.org/xfn/1">
<title><?php bloginfo('name'); ?><?php wp_title(); ?></title>

<meta http-equiv="Content-Type" content="text/html; charset=<?php bloginfo('charset'); ?>" />
<meta name="generator" content="WordPress <?php bloginfo('version'); ?>" /> 

<style type="text/css" media="screen">
v @import url( <?php echo get_settings('siteurl'); ?>/wp-layout.css );
</style>

<link rel="stylesheet" type="text/css" media="print" href="<?php echo get_settings('siteurl'); ?>/print.css" />
<link rel="alternate" type="application/rss+xml" title="RSS 2.0" href="<?php bloginfo('rss2_url'); ?>" />
<link rel="alternate" type="text/xml" title="RSS .92" href="<?php bloginfo('rss_url'); ?>" />
<link rel="alternate" type="application/atom+xml" title="Atom 0.3" href="<?php bloginfo('atom_url'); ?>" />

<link rel="pingback" href="<?php bloginfo('pingback_url'); ?>" />
<?php wp_get_archives('type=monthly&format=link'); ?>
<?php //comments_popup_script(); // off by default ?>
<?php wp_head(); ?>
</head>

<body>
<div id="rap">
<h1 id="header"><a href="<?php bloginfo('url'); ?>"><?php bloginfo('name'); ?></a></h1>

<div id="content">
<?php if ($posts) : foreach ($posts as $post) : start_wp(); ?>

<?php the_date('','<h2>','</h2>'); ?>

<div class="post">
<h3 class="storytitle" id="post-<?php the_ID(); ?>"><a href="<?php the_permalink() ?>" rel="bookmark" title="Permanent Link: <?php the_title(); ?>"><?php the_title(); ?></a></h3>
<div class="meta"><?php _e("Filed under:"); ?> <?php the_category() ?> — <?php the_author() ?> @ <?php the_time() ?> <?php edit_post_link(); ?></div>

<div class="storycontent">
<?php the_content(); ?>
</div>

<div class="feedback">
<?php wp_link_pages(); ?>
<?php comments_popup_link(__('Comments (0)'), __('Comments (1)'), __('Comments (%)')); ?>
</div>


<?php include(ABSPATH . 'wp-comments.php'); ?>
</div>

<?php endforeach; else: ?>
<p><?php _e('Sorry, no posts matched your criteria.'); ?></p>
<?php endif; ?>
</div>

<div id="menu">

<ul>
<?php get_links_list(); ?>
<li id="categories"><?php _e('Categories:'); ?>
v <ul>
<?php wp_list_cats(); ?>
</ul>
</li>
<li id="search">
<label for="s"><?php _e('Search:'); ?></label> <form id="searchform" method="get" action="<?php echo $PHP_SELF; ?>">
<div>
<input type="text" name="s" id="s" size="15" /><br />
<input type="submit" name="submit" value="<?php _e('Search'); ?>" />
</div>
</form>
</li>
<li id="archives"><?php _e('Archives:'); ?>
<ul>
<?php wp_get_archives('type=monthly'); ?>
</ul>
</li>
<li id="calendar">
<?php get_calendar(); ?>
</li>
<li id="other"><?php _e('Other:'); ?>
<ul>
<li><a href="<?php echo get_settings('siteurl'); ?>/wp-login.php"><?php _e('Login'); ?></a></li>
<li><a href="<?php echo get_settings('siteurl'); ?>
/wp-register.php"><?php _e('Register'); ?></a></li>
</ul>
</li>
<li id="meta"><?php _e('Meta:'); ?>
<ul>
<li><a href="<?php bloginfo('rss2_url'); ?>" title="<?php _e('Syndicate this site using RSS'); ?>"><?php _e('<abbr title="Really Simple Syndication">RSS</abbr> 2.0'); ?></a></li>
<li><a href="<?php bloginfo('comments_rss2_url'); ?>" title="<?php _e('The latest comments to all posts in RSS'); ?>"><?php _e('Comments <abbr title="Really Simple Syndication">RSS</abbr> 2.0'); ?></a></li>
<li><a href="http://validator.w3.org/check/referer" title="<?php _e('This page validates as XHTML 1.0 Transitional'); ?>"><?php _e('Valid <abbr title="eXtensible HyperText Markup Language">XHTML</abbr>'); ?></a></li>
<li><a href="http://wordpress.org/" title="<?php _e('Powered by WordPress; state-of-the-art semantic personal publishing platform.'); ?>">WP</a></li>
</ul>
</li>

</ul>

</div>

</div>

<p class="credit"> <cite><?php echo sprintf(__("Powered by <a href='http://wordpress.org' title='%s'><strong>WordPress</strong></a>"), __("Powered by WordPress, state-of-the-art semantic personal publishing platform")); ?></cite></p>
</body>
</html>

Chop out everything that is highlighted here, and save what is left as 'template.php'.

<?php
/* Don't remove this line. */
require('./wp-blog-header.php');
?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml">

<head profile="http://gmpg.org/xfn/1">
<title><?php bloginfo('name'); ?><?php wp_title(); ?></title>

<meta http-equiv="Content-Type" content="text/html; charset=<?php bloginfo('charset'); ?>" />
<meta name="generator" content="WordPress <?php bloginfo('version'); ?>" /> 

<style type="text/css" media="screen">
@import url( <?php echo get_settings('siteurl'); ?>/wp-layout.css );
</style>

<link rel="stylesheet" type="text/css" media="print" href="<?php echo get_settings('siteurl'); ?>/print.css" />
<link rel="alternate" type="application/rss+xml" title="RSS 2.0" href="<?php bloginfo('rss2_url'); ?>" />
<link rel="alternate" type="text/xml" title="RSS .92" href="<?php bloginfo('rss_url'); ?>" />
<link rel="alternate" type="application/atom+xml" title="Atom 0.3" href="<?php bloginfo('atom_url'); ?>" />

<link rel="pingback" href="<?php bloginfo('pingback_url'); ?>" />
<?php wp_get_archives('type=monthly&format=link'); ?>
<?php //comments_popup_script(); // off by default ?>
<?php wp_head(); ?>
</head>

<body>
<div id="rap">
<h1 id="header"><a href="<?php bloginfo('url'); ?>"><?php bloginfo('name'); ?></a></h1>

<div id="content">

<?php if ($posts) : foreach ($posts as $post) : start_wp(); ?>

<?php the_date('','<h2>','</h2>'); ?>

<div class="post">
<h3 class="storytitle" id="post-<?php the_ID(); ?>"><a href="<?php the_permalink() ?>" rel="bookmark" title="Permanent Link: <?php the_title(); ?>"><?php the_title(); ?></a></h3>
<div class="meta"><?php _e("Filed under:"); ?> <?php the_category() ?> — <?php the_author() ?> @ <?php the_time() ?> <?php edit_post_link(); ?></div>

<div class="storycontent">
<?php the_content(); ?>
</div>

<div class="feedback">
<?php wp_link_pages(); ?>
<?php comments_popup_link(__('Comments (0)'), __('Comments (1)'), __('Comments (%)')); ?>
</div>


<?php include(ABSPATH . 'wp-comments.php'); ?>
</div>

<?php endforeach; else: ?>
<p><?php _e('Sorry, no posts matched your criteria.'); ?></p>
<?php endif; ?>
</div>

<div id="menu">

<ul>
<?php get_links_list(); ?>
<li id="categories"><?php _e('Categories:'); ?>
v <ul>
<?php wp_list_cats(); ?>
</ul>
</li>
<li id="search">
<label for="s"><?php _e('Search:'); ?></label> <form id="searchform" method="get" action="<?php echo $PHP_SELF; ?>">
<div>
<input type="text" name="s" id="s" size="15" /><br />
<input type="submit" name="submit" value="<?php _e('Search'); ?>" />
</div>
</form>
</li>
<li id="archives"><?php _e('Archives:'); ?>
<ul>
<?php wp_get_archives('type=monthly'); ?>
</ul>
</li>
<li id="calendar">
<?php get_calendar(); ?>
</li>
<li id="other"><?php _e('Other:'); ?>
<ul>
<li><a href="<?php echo get_settings('siteurl'); ?>/wp-login.php"><?php _e('Login'); ?></a></li>
<li><a href="<?php echo get_settings('siteurl'); ?>
/wp-register.php"><?php _e('Register'); ?></a></li>
</ul>
</li>
<li id="meta"><?php _e('Meta:'); ?>
<ul>
<li><a href="<?php bloginfo('rss2_url'); ?>" title="<?php _e('Syndicate this site using RSS'); ?>"><?php _e('<abbr title="Really Simple Syndication">RSS</abbr> 2.0'); ?></a></li>
<li><a href="<?php bloginfo('comments_rss2_url'); ?>" title="<?php _e('The latest comments to all posts in RSS'); ?>"><?php _e('Comments <abbr title="Really Simple Syndication">RSS</abbr> 2.0'); ?></a></li>
<li><a href="http://validator.w3.org/check/referer" title="<?php _e('This page validates as XHTML 1.0 Transitional'); ?>"><?php _e('Valid <abbr title="eXtensible HyperText Markup Language">XHTML</abbr>'); ?></a></li>
<li><a href="http://wordpress.org/" title="<?php _e('Powered by WordPress; state-of-the-art semantic personal publishing platform.'); ?>">WP</a></li>
</ul>
</li>

</ul>

</div>

</div>

<p class="credit"> <cite><?php echo sprintf(__("Powered by <a href='http://wordpress.org' title='%s'><strong>WordPress</strong></a>"), __("Powered by WordPress, state-of-the-art semantic personal publishing platform")); ?></cite></p>
</body>
</html>

Use

Open this file - template.php - in your editor of choice.
Type your desired words <div id="content"> inside this div </div>
Save the file - for instance 'aboutme.php'
Upload to your WP directory

Read

Now you've got your template for your static pages, you need to consider this:

As this template is right now, it will ONLY work if this file is in the same directory as your WordPress index.php file. If you want to move it elsewhere, you must change this line:

<?php
/* Don't remove this line. */
require('./wp-blog-header.php');
?>
and the path to the file wp-blog-header.php must be correct.
The static content that you want to write must go inside the content div. Use the same CSS as you have for your blog, but be aware that you may also need to use some additional tags. A blog entry would go inside a storycontent block, and that would be inside a post block and both of those are inside the content block. So if your text suddenly looks wierd, just play with the css.
(Note - I know the term 'block' is technically incorrect there, but you know what I mean).

But I don't want it like that.....

So you don't want the menu on every page ? Or you want to do lots of pages but not have to fiddle with them all when you want to change a few bits ? No problem, it's very doable.

I'm assuming that you have made the file above - 'template.php' and that it looks like this:

<?php
/* Don't remove this line. */
require('./wp-blog-header.php');
?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml">

<head profile="http://gmpg.org/xfn/1">
<title><?php bloginfo('name'); ?><?php wp_title(); ?></title>

<meta http-equiv="Content-Type" content="text/html; charset=<?php bloginfo('charset'); ?>" />
<meta name="generator" content="WordPress <?php bloginfo('version'); ?>" /> 

<style type="text/css" media="screen">
@import url( <?php echo get_settings('siteurl'); ?>/wp-layout.css );
</style>

<?php wp_head(); ?>
</head>

<body>
<div id="rap">
<h1 id="header"><a href="<?php bloginfo('url'); ?>"><?php bloginfo('name'); ?></a></h1>

<div id="content">
</div>

<div id="menu">

<ul>
<?php get_links_list(); ?>
<li id="categories"><?php _e('Categories:'); ?>
v <ul>
<?php wp_list_cats(); ?>
</ul>
</li>
<li id="search">
<label for="s"><?php _e('Search:'); ?></label> <form id="searchform" method="get" action="<?php echo $PHP_SELF; ?>">
<div>
<input type="text" name="s" id="s" size="15" /><br />
<input type="submit" name="submit" value="<?php _e('Search'); ?>" />
</div>
</form>
</li>
<li id="archives"><?php _e('Archives:'); ?>
<ul>
<?php wp_get_archives('type=monthly'); ?>
</ul>
</li>
<li id="calendar">
<?php get_calendar(); ?>
</li>
<li id="other"><?php _e('Other:'); ?>
<ul>
<li><a href="<?php echo get_settings('siteurl'); ?>/wp-login.php"><?php _e('Login'); ?></a></li>
<li><a href="<?php echo get_settings('siteurl'); ?>
/wp-register.php"><?php _e('Register'); ?></a></li>
</ul>
</li>
<li id="meta"><?php _e('Meta:'); ?>
<ul>
<li><a href="<?php bloginfo('rss2_url'); ?>" title="<?php _e('Syndicate this site using RSS'); ?>"><?php _e('<abbr title="Really Simple Syndication">RSS</abbr> 2.0'); ?></a></li>
<li><a href="<?php bloginfo('comments_rss2_url'); ?>" title="<?php _e('The latest comments to all posts in RSS'); ?>"><?php _e('Comments <abbr title="Really Simple Syndication">RSS</abbr> 2.0'); ?></a></li>
<li><a href="http://validator.w3.org/check/referer" title="<?php _e('This page validates as XHTML 1.0 Transitional'); ?>"><?php _e('Valid <abbr title="eXtensible HyperText Markup Language">XHTML</abbr>'); ?></a></li>
<li><a href="http://wordpress.org/" title="<?php _e('Powered by WordPress; state-of-the-art semantic personal publishing platform.'); ?>">WP</a></li>
</ul>
</li>

</ul>

</div>

</div>

<p class="credit"> <cite><?php echo sprintf(__("Powered by <a href='http://wordpress.org' title='%s'><strong>WordPress</strong></a>"), __("Powered by WordPress, state-of-the-art semantic personal publishing platform")); ?></cite></p>
</body>
</html>

Okay...now what you have to do is cut the following areas out.
Highlight the yellow area. Cut it out, paste into your text editor and save as 'TOP.php'
Highlight the blue area. Cut it out, paste into your text editor and save as 'BOTTOM.php'
Do it carefully.

<?php
/* Don't remove this line. */
require('./wp-blog-header.php');
?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml">

<head profile="http://gmpg.org/xfn/1">
<title><?php bloginfo('name'); ?><?php wp_title(); ?></title>

<meta http-equiv="Content-Type" content="text/html; charset=<?php bloginfo('charset'); ?>" />
<meta name="generator" content="WordPress <?php bloginfo('version'); ?>" /> 

<style type="text/css" media="screen">
@import url( <?php echo get_settings('siteurl'); ?>/wp-layout.css );
</style>

<?php wp_head(); ?>
</head>

<body>
<div id="rap">
<h1 id="header"><a href="<?php bloginfo('url'); ?>"><?php bloginfo('name'); ?></a></h1>

<div id="content">
</div>

<div id="menu">

<ul>
<?php get_links_list(); ?>
<li id="categories"><?php _e('Categories:'); ?>
v <ul>
<?php wp_list_cats(); ?>
</ul>
</li>
<li id="search">
<label for="s"><?php _e('Search:'); ?></label> <form id="searchform" method="get" action="<?php echo $PHP_SELF; ?>">
<div>
<input type="text" name="s" id="s" size="15" /><br />
<input type="submit" name="submit" value="<?php _e('Search'); ?>" />
</div>
</form>
</li>
<li id="archives"><?php _e('Archives:'); ?>
<ul>
<?php wp_get_archives('type=monthly'); ?>
</ul>
</li>
<li id="calendar">
<?php get_calendar(); ?>
</li>
<li id="other"><?php _e('Other:'); ?>
<ul>
<li><a href="<?php echo get_settings('siteurl'); ?>/wp-login.php"><?php _e('Login'); ?></a></li>
<li><a href="<?php echo get_settings('siteurl'); ?>
/wp-register.php"><?php _e('Register'); ?></a></li>
</ul>
</li>
<li id="meta"><?php _e('Meta:'); ?>
<ul>
<li><a href="<?php bloginfo('rss2_url'); ?>" title="<?php _e('Syndicate this site using RSS'); ?>"><?php _e('<abbr title="Really Simple Syndication">RSS</abbr> 2.0'); ?></a></li>
<li><a href="<?php bloginfo('comments_rss2_url'); ?>" title="<?php _e('The latest comments to all posts in RSS'); ?>"><?php _e('Comments <abbr title="Really Simple Syndication">RSS</abbr> 2.0'); ?></a></li>
<li><a href="http://validator.w3.org/check/referer" title="<?php _e('This page validates as XHTML 1.0 Transitional'); ?>"><?php _e('Valid <abbr title="eXtensible HyperText Markup Language">XHTML</abbr>'); ?></a></li>
<li><a href="http://wordpress.org/" title="<?php _e('Powered by WordPress; state-of-the-art semantic personal publishing platform.'); ?>">WP</a></li>
</ul>
</li>

</ul>

</div>

</div>

<p class="credit"> <cite><?php echo sprintf(__("Powered by <a href='http://wordpress.org' title='%s'><strong>WordPress</strong></a>"), __("Powered by WordPress, state-of-the-art semantic personal publishing platform")); ?></cite></p>
</body>
</html>

Not a lot left is there ? :)

So what you have is two lines.

<div id="content">
</div>

Now remember that further up I said that this stuff will only work if it's all in the same directory as your WP index.php ? It will still only work that way.
Upload 'TOP.php' and 'BOTTOM.php' to your WP directory.
Now we make the page content........

<?php include ('TOP.php'); ?>
<div id="content">
</div>
<?php include ('BOTTOM.php'); ?>

Save this as 'MIDDLE.php'

This file is now your actual page template.
So to make a page about your love for pineapple:

<?php include ('TOP.php'); ?>
<div id="content">
I like pineapple I do.
It's really lovely.
Rah !
</div>
<?php include ('BOTTOM.php'); ?>

Save that as 'pineapple.php', upload to your WP directory and it will function as a complete page.

Static Pages

Plugins ?

Gutting time !

Use

Read

But I don't want it like that.....

More Read....