WP "postinfo" How do I add this to my theme?

I have a custom theme at my blog. I really want the comment section I saw here at http://desperateexes.com I've attached an image so you can see. I need to know how to code it into my theme.

 

Hi,

you must first create a file, with a text editor, named postinfo.php:

<div class="postinfo">
	<p><b>About this Post</b><br />	
	<a href="<?php the_permalink() ?>" rel="bookmark">Permalink</a> | <a href="<?php trackback_url() ?>">Trackback</a> | 	
	<script type="text/javascript">
		<!-- Begin
		function isPPC() {
		if (navigator.appVersion.indexOf("PPC") != -1) return true;
		else return false;
		}
		if(isPPC()) {
		document.write('<a class="contact" HREF=\"mailto:\?subject\=See this post I found, ' + document.title + '?body=You can see this post clicking on: ' + window.location + '\" onMouseOver="window.status=\'Send to a friend this post\'; return true" TITLE="Send to a friend this post">Send to a friend this post<\/a>');
		}
		else { document.write('<a class="contact" HREF=\"mailto:\?body\=Take a look at this page I found, ' + document.title + '. You can see this page at: ' + window.location + '\" onMouseOver="window.status=\'Send to a friend this post\'; return true" TITLE="Send to a friend this post">Send to a friend this post<\/a>');
		}
		//  End -->
		</script> | 
	<a href="javascript:window.print()">Print this post</a> | <?php comments_popup_link('Leave a comment'); ?><br />
	</p>
</div>

Code (markup):

Then, in the index.php file, add this code:

<?php
	include("postinfo.php");
	?>

Code (markup):

where do you want to show the postinfo.

In the CSS file you must add the class for postinfo:

.postinfo p{
	width: 550px;
	background: #E8EAF1;
	font-size:80%;
	color: #121212;
	margin: 10px 0px 30px 0px;
	padding: 6px;        
	border-top: 1px dotted #121212;
	border-bottom: 1px dotted #121212;
	line-height: 10px;
	}

.postinfo p a{
font-size:80%
}

Code (markup):

.

That's all.

 

Okay, I did that. It's the general idea I'm looking for, but it shows up only on the main page, not on the post page itself, and then what about the formatting of the box? If you wouldn't mind, take a look at it here:
http://www.publicrecordsguy.com/ and then on the post itself http://www.publicrecordsguy.com/migden-fined-again/
Thanks so much... I really want the box to be grey shaded like the one I referenced previously.

 

Put the same code in the single.php (Single Post) file to get it showing up on individual blog posts.

 

You must change the CSS:

.postinfo p{
	width: 550px;
	[B]background: #E8EAF1;[/B]
	font-size:80%;
	[B]color: #121212;[/B]
	margin: 10px 0px 30px 0px;
	padding: 6px;        
	[B]border-top: 1px dotted #121212;
	border-bottom: 1px dotted #121212;[/B]
	line-height: 10px;
	}

Code (markup):

 

Here is the Index.php file:

<?php get_header(); ?>

		 <div id="main">
		 
<?php
$postnum = 1;
$showadsense1 = 1;
?>
<?php if(have_posts()) : ?>

<?php while(have_posts()) : the_post(); ?>
		 	
		 	<div class="post" id="post-<?php the_ID(); ?>">
		 		<div class="header">
		 			<div class="date"> <div class="number"><?php the_time('j'); ?></div><div class="month"><?php the_time('M'); ?></div><div class="year"><?php the_time('Y'); ?></div></div>
		 			<div class="title"><a href="<?php the_permalink(); ?>" title="<?php the_title(); ?>"><?php the_title(); ?></a></div>
		 		</div>
		 		
		 		<div class="content"><?php the_content('<b>WAIT! THERE'S MORE</b> &raquo;'); ?></div>
		 		<?php
	include("postinfo.php");
	?>
		 		<div class="link"><a href="<?php comments_link(); ?>">Leave a Comment &raquo;</a></div>
		 	</div><!-- end of post -->
		 	
		 	
<?php if ($postnum == $showadsense1) {
echo '
<div id="ad_middle">
<script type="text/javascript"><!--
google_ad_client = "pub-1420135286115872";
/* 468x15, created 2/18/08 */
google_ad_slot = "3884979312";
google_ad_width = 468;
google_ad_height = 15;
//-->
</script>
<script type="text/javascript"
src="http://pagead2.googlesyndication.com/pagead/show_ads.js">
</script>
</div>
';
} ?>		 	
<?php $postnum++; ?>
	
		 <?php endwhile; ?>
		 	<div id="post_nav">
		 		<div class="prev"><?php next_posts_link('&laquo; Older Entries') ?></div>
		 		<div class="new"><?php previous_posts_link('Newer Entries &raquo;') ?></div>
		 	</div>			 
		 
	<?php else : ?>

	<div class="post">
		<h2 class="center">Not Found</h2>
		<p class="center">Sorry, but you are looking for something that isn't here.</p>
	</div>

	<?php endif; ?>		 	
</div><!-- end of main -->

<?php get_sidebar(); ?>

<?php get_footer(); ?>

Code (markup):

And here is how it looks:


Here is the CSS of it:

.postinfo p{
	width: 450px;
	height: 30px;
        background: #E8EAF1;
	font-size:80%;
	color: #121212;
	margin: 10px 0px 30px 0px;
	padding: 6px;        
	border-top: 1px dotted #121212;
	border-bottom: 1px dotted #121212;
	line-height: 10px;
	}

.postinfo p a{
font-size:80%
}

Code (markup):

Tips?

 

I should add, I don't want it to show up on the homepage at all. I only want it to show up on the post page as the post is read, that way it doesn't show up below, "WAIT THERE'S MORE". Make sense?

 

Okay, now the sidebar is going under the post????
www.publicrecordsguy.com/are-emails-public-records?

 

Think I fixed it. WOW, learning Wordpress by the seat of your pants takes time...