Author Box represents the Authors Name and other details of the author below the post he has written , this is useful in site were their are Multi Authors , and also its quit great to install it on any site to let the visitors know who’s post they have read and they get some more information of the author and they then also check out other posts by the similar author. if they like the earlier post of the author.
Installing Author Box in thesis :
Installing Author Box in thesis is quit easy like always it is we have to just add few lines of code in custom_functions.php
- Login to your WordPress Dashboard
- Go to Thesis >> Custom File Editor
- Select custom_functions.php file to edit and add the below line of code :
function thesis_author_box() { if (is_single()) { ?> <div class="author_info"> <h4>This post was written by...</h4> <span class="author_photo"><?php echo get_avatar( get_the_author_id() , 48 ); ?></span> <p><?php the_author_posts_link(); ?> – who has written <?php the_author_posts(); ?> posts on <a href="<?php bloginfo('home'); ?>"><?php bloginfo('name'); ?></a>.</p> <p><?php the_author_description(); ?></p> <p class="author_email"><a href="mailto:<?php the_author_email(); ?>" title="Send an Email to the Author of this Post">Contact the author</a></p> </div> <?php } } add_action('thesis_hook_after_post','thesis_author_box');
- Save the custom_functions.php
- Now we are going to add some CSS ( Cascading Style Sheets ) so Open custom.css and add below lines of code :
.custom .author_info { border:1px dotted #666; padding:1.0em; } .custom .author_info a { color:#cc0000; border-bottom:1px dotted #fff; text-decoration:none; } .custom .author_info a:hover { border-bottom:1px dotted #cc0000; } .custom .author_info .author_photo img { border:1px dotted #666; padding:0.2em; float:left; margin:1.0em 1.0em 1.0em 0em; } .custom .author_info p { margin-top:0.8em; margin-bottom:0.4em; } .custom .author_info p.author_email { text-indent:1.8em; background: url('images/my-email-icon.gif') 0px 4px no-repeat; }
- Save the File , Now you have Successfully installed Author Box
Customizing Author Box :
How can i change Color , Text font, etc. ?
All of this belongs to one thing thats the CSS of the Author Box placed in custom.css , go and change it in your style for that you need some CSS knowledge you can get it from here.
How to change the Avatar ?
The Authors avatar is called from Gravatar , to change that just go to Gravatar.com
How to change Avatars size ?
To change the avatars size in Author Box , find number representing “48” at line 6 in the PHP code that is been added to custom_functions.php
How to Show Author Box on all pages instead of only post pages ?
To Show Author Box only on post pages we have used WordPress conditional tag is_single() . Now just remove “is_single() {“ from line 2 and the single curly bracket from the last line of the code i.e “}”
I guess that’s enough for today , if you need any further help customizing Author Box or making some changes in it then just contact me. Hope you loved todays post and will love to receive feedbacks regarding it
Sudeep Acharya says
Myblog is ctips4u.blogspot.com i think u know me and the thing i want to ask is how you do this for blogger blog.
Ritesh Sanap says
Sudeep ,
Doing this for blogger is complicated as if your Blog is multi authored and because of that you need to add the code manually.
Gowtham@mytechshout.com says
Nice post.Very helpful to add the author box to my site.Thanks.
Literature Review says
Your blog is really helps for my search and i really like it.. Thanks a lot..:)
Randy says
I can get the information but I cannot get the border of the box :/ Any advice? The code in customs.css does not make any difference
Ritesh Sanap says
Randy, your CSS of box maybe conflicted with some other CSS