Tweaking your WordPress Theme (Part 2)

In today’s post, we will be sharing another three tips on tweaking your WordPress theme

Page Navigation

Many themes display all of your pages across the top of your site. But let’s say you’d like to exclude a page from the main navigation. Here’s one way you can do it:

Look for the following code (usually in the header.php file):

<?php wp_list_pages(); ?>

Change it to this:

<?php wp_list_pages(‘exclude=4’); ?>

This will tell WordPress to list all your pages except for the page with ID 4. You can change this number to whichever Page ID you’d like to exclude.

If you want to exclude more than one page, simply separate all the page IDs with a comma, like this:

<?php wp_list_pages(‘exclude=4,5,7,10’); ?>

For more information on WP list pages: http://codex.wordpress.org/Template_Tags/wp_list_pages

Add Something (Anything) to the End of Every Blog Post

Maybe you want to add a link to subscribe to your newsletter, an advertisement, etc. To the end of every blog post. Here’s how you do it:

The file you need to edit is the single.php. This is the template that displays your single articles. Open the file and find a good spot for the content you want to add. For example, to add a “Subscribe to newsletter” link after your post (and before the comments):

<?php the_content(); ?>

[the “subscribe to newsletter” link]

<?php comments_template(); ?>

Changing the Header Image

Websites are often judged by their looks and the first impression comes from the header – it is the first thing that your visitors see.

Your theme’s header is specified in the header.php and the style.css files. In the header.php file, you may see:

<div id=”header”>

<div id=”headerimg”>

<h1>

<a href=”<?php echo get_option(‘home’); ?>”>

</h1>

<div class=”description”>

<?php bloginfo(‘description’); ?>

</div>

</div>

</div>

And in the styles.css file, you may see:

#header {

background: url(“<?php bloginfo(‘stylesheet_directory’); ?>/images/header.jpg”>

no-repeat bottom center; }

#headerimg {

margin: 10px 8px 0;

height: 192px;

width: 740px; }

To change the image file, replace the “header.jpg” with the name of the new image file you have uploaded to replace it. If it is in a different directory, replace the bloginfo() tag with the address of the image’s location.

If you are using an image that is the same size, then simply replace the image. But if the image is a different size, change the height and width in the #headerimg section.

For more information: http://codex.wordpress.org/Designing_Headers

Leave a Comment