Viralogy Themes

Notice: Do not copy and past the code below into your .php files.  This code has been formatted through html.  Please type in the actual code into your .php file.  This also helps you learn how to code html and you’ll be a CSS master in no time 

1. Open up header.php for JunPress or open up sidebar.php for PhenPress

2. The image size is currently set to 100px by 125px.  If you would like to add an image without resizing the header, just add an image that is 100px by 125px.  If you would like to change the size of the image, go to this tutorial.

3. The code that you will be looking for is in the “about” div which is seen here:

<div id=”about”>

<div id=”about-left”>

<div id=”about-title”>
<a rel=”nofollow” href=”<?php echo get_bloginfo(’url’);?>/about/”>About</a>
</div>

<div id=”about-description”>
Description about you that you can edit.
<p />
<a rel=”nofollow” href=”<?php echo get_bloginfo(’url’);?>/about/”>Learn more about me</a>
</div>

</div>

<div id=”about-image”>
<img src=”http://junloayza.wordpress.com/files/2009/05/junpress-about.jpg” alt=”JunPress About Image”>
</div>

</div>

4. In the “about” div, locate the following code which pertains to the about image:

<div id=”about-image”>
<img src=”http://junloayza.wordpress.com/files/2009/05/junpress-about.jpg” alt=”JunPress About Image”>
</div>

5. Add the url for the image you want to the <img src=””>.  For example:

<img src=”http://domainforthesite.com/images/filenamefortheimage.jpg”>

6. Add the short description for the image in the alt=””.  For example:

alt=”Short description of image”

7. Put it all together and the new code looks like this:

<div id=”about-image”>
<img src=”http://domainforthesite.com/images/filenamefortheimage.jpg” alt=”Short description of image”>
</div>

8. Save the file

If you have any questions about this, feel free to ask me in the comment section.  Thanks!