How to Make Author Information Section After Every Post In WordPress

Posted by Ankur Gandhi in Wordpress



Hello Friends, Two days ago I was searching about WordPress Plugin which can make one box for Author Information with Gravatar image after every post. It means simply I want to show information of Author of that post, I have searched on internet for this and found so many plugins which were related to author info but no one can totally filling my requirements. I want a Author Information box which having my Gravtar image, One text with my name like ‘Article By Ankur Gandhi’ and My name should be linked to my website which I have entered in my profile in admin, third thing I want one text saying like ‘Ankur Gandhi has blogged 100 Article’ in this Ankur Gandhi Should be linked to Ankur Gandhi’s Posts archive and in place of 100 it should show total post of Ankur Gandhi and lastly want one long sentance for email subscriber link, feed subscriber link and comment link. So I want to make it like this :

Author Information After Every Post How to Make Author Information Section After Every Post In Wordpress

Author Information After Every Post

Now to make this custom type of Author Information box It is must to do some changes in single.php file and also add some code to single.php file. If you are not familiar with programming then don’t be worry, I am explaining things below in detail so anyone who can’t programming can do this thing easily. So follow steps given below:

1. Login to admin.

2. Go to Apperance -> Editor.

3. It will open stylesheet for your theme, which name should style.css.

4. Go to bottom at that page and post this CSS codegiven below at last and save it and check your site to just make sure that all things are going i right way. In case of anything happened wrong then remove this code again from your CSS file.

.authbio{
color: #000000;
font-weight: normal;
background: #F6F6F6;
border: 1px solid #ccc;
width: 95%;
height:140px;
padding: 8px;
margin-bottom:5px;
-moz-border-radius:10px 10px 10px 10px;
}
.authdesc
{
float: left; padding-left: 7px; padding-top: 4px;
width:425px;
}
.tppad5px
{
padding-top:5px;
vertical-align:top;
}
.fltlft
{
float:left;
}

5. Select Single Post (single.php) from right side and first take backup of it on your local PC.

6. Now main point comes, find the_content function. Which can be look like in default theme shown below and in your custom new theme it can be anything . the_content is look like shown below in your single.php.

<?php the_content(‘<p>Read the rest of this entry &raquo;</p>’); ?>

Part which is in RED can be anything in your single.php file and also check that blue part which indicate end of php tag.

7. So when you find the_content function and end of php tag which is in blue color in upper code and you are sure about that then just paste this code(Click on link given Below ) after the_content function but before pasting this code dont forget to take backup of single.php file.

<div class=”authbio”>
<div class=”fltlft”>
<?php echo get_avatar(get_the_author_meta(‘user_email’), ‘80‘, ” ); ?>
</div>
<div class=”authdesc”>
<div>
<h3>Article By
<?php if (get_the_author_url())
{
?>
<a href=”<?php the_author_url(); ?>”>
<?php the_author(); ?>
</a>
<?php }
else
{
the_author();
}
?>
</h3>
</div>
<div>
<?php the_author_posts_link(); ?>
has blogged
<?php the_author_posts(); ?>
articles.
</div>
<div class=”tppad5px”>
Hope you have enjoyed reading this, please consider to <a href=”#comments”>leave a comment</a>
or you can <a href=”<?php bloginfo(‘rss2_url’); ?>”>subscribe to the posts here</a> or <a href=”http://feedburner.google.com/fb/a/mailverify?uri=HackingEthics&loc=en_US” target=”_blank”>by Email from here</a> so that my upcoming posts will reach you in time.</div>
</div>
</div>

7. Now in upper code i have make some things in RED and one thing in blue to let you you what it that things and you have to change these things with your information. Firstly there is one part 80 is in RED, 80 is used for Gravatar image width , So if you want big image then change this value so image will automatically set its height ans show here. To show image here you must have Gravatar.com account and and also profile image in it, So if you have Gravatar.com account with the same email address you have settled up with this wordpress blog then your Gravatar.com image will show up here automatically and whenever you update image in Gravatar it will automatically updates here.

Now second thing is in RED is http://feedburner.google.com/fb/a/mailverify?uri=HackingEthics&loc=en_US , this is used to make a link to subscribe your users to your site via email by feedburner so if you know your feedburner email subscribe link then put here and if you don’t know feedburner email sunscribe URL then change you feed address with HackingEthics which is in blue color.For example if youe site feed name is phpzone then email link for subscriber would be http://feedburner.google.com/fb/a/mailverify?uri=phpzone&loc=en_US.

7. After changing all these things save this file and then clear cache if you are using any cache plugin like WP Super Cache or WP total Cache plugin and then check your any post in detail. You will see same author info box like me on your site.

8. Now you can change colors in that box by changing that CSS code in style.css file.

I have tried to include everything in this post so you can make this author info box easily. But in case of i forgot anything then let me know, please post it in comment i will update it.

If you need my assistance or help to do this thing then post it in comment. Also if you want to customize your wordpress blog or want make any other site then you can contact me from here.

Gravatar

You can follow any responses to this entry through the RSS 2.0 You can leave a response, or trackback.

  • http://www.ravenousravendesign.com Heather Wood

    I’m gonna try this on my site when I get home later. Awesome man! Thanks ^_^