How to Remove the Double Border

This mod is relatively easy, but nonetheless might be asked down the line. Open up your style.css file, and find the following piece of code:

#wrap {
background: #FFFFFF;
width: 920px;
margin: 10px auto 10px;
padding: 0px 20px 20px 20px;
border: double #C0C0C0;
}

Simply remove the line that defines the border for the #wrap container. Your new code should look like this:

#wrap {
background: #FFFFFF;
width: 920px;
margin: 10px auto 10px;
padding: 0px 20px 20px 20px;
}

Creating a Featured Page

When you create a static page in WordPress, your blog will look for the page.php file by default. Currently, that will display your content and that will look like the Sample Page. If you want something with a little more pizazz, then you can use the Featured Page template, and it will display content that will look like the Featued Page.

You may be asking yourself how you can create a Featured Page - this can be done easily, but needs a few steps in order for it to work. First, when you create the page, you will need to select the Featured Page template within your dashboard. Here’s a screenshot that will show you where to select that:

All of the coding for the Featured Page can be found in the page_featured.php file of the Revolution theme. In order to know how to customize certain parts of it, you should know what each section is, and where the information that is there comes from. Here’s a breakdown of the main sections of the Featured Page:

Section #1 - This is hardcoded text and can be found and modified within the page_featured.php file.

Section #2 - This is a dynamic WordPress call, and is currently set to display the previous 10 posts, sorted by descending order of date written.

Section #3 - This is the main content area of the page - whatever you type into the text editor while creating a page will show up in this location.

Section #4 - This is hardcoded text and can be found and modified within the sidebar_page.php file.

Using A Dynamic Header

The Revolution theme is currently using an image for the logo in the upper left hand section of the header. Some bloggers wish to use a dynamic call for the blog title and the blog description. With the help of this tutorial, changing the code from a static image to a dynamic call is really easy.

The first thing you need to do is add padding to the top of the #headerleft section inside the style.css file. Look for this piece of code towards the top of the file:

#headerleft {
width: 460px;
float: left;
font-size: 14px;
margin: 0px;
padding: 0px 0px 0px 0px;
overflow: hidden;
}

As you can see, that section currently has a top padding of 0px, which allows the logo.gif to stay at the top of the container. What you will want to do is change the top padding to 30px, so your code should look like this:

#headerleft {
width: 460px;
float: left;
font-size: 14px;
margin: 0px;
padding: 30px 0px 0px 0px;
overflow: hidden;
}

The other thing that you will need to change is the code for the #headerleft container which can be found within the header.php file. Look for this piece of code:

<div id="headerleft">
<a href="<?php echo get_settings('home'); ?>/"><img src="<?php bloginfo('template_url'); ?>/images/logo.gif" alt="<?php bloginfo('name'); ?>" /></a>
</div>

You will want to replace that code with this:

<div id="headerleft">
<a href="<?php echo get_settings('home'); ?>/"><?php bloginfo('name'); ?></a><br />
<?php bloginfo('description'); ?>
</div>

At this point, all you need to do is simply upload your style.css and header.php files onto your server and replace the ones that are currently there. Refresh your screen, and voila, you now have a dynamic header!

« Previous Page