In this tutorial you can learn how to add the author’s profile box at the end of the post. In your website, if anybody writing the guest post , the visitors can easily recognize about the author of the post through this. To show in author’s profile box, the details are taken from the admin panel of the user profile. It’s not only for guest post but also any author of the post.
Before adding the Author’s profile box:
- Author’s profile box Before
After adding the Author’s profile box:
- Author’s profile box After
How to add this Author’s profile watch this video below:
It’s take too much time to buffering. Don’t hesitate. Keep reading rest of the post.
1. Login to wordpress admin panel.
2. Go to user panel then select your profile and type the biographical info about yourself.
3. Then, click update.
4. To do this process use FTP. copy this below code and paste it on launch.php or custom_function.php.
function post_footer_author() {
if (is_single())
{ ?>
<div class="postauthor">
<?php echo get_avatar( get_the_author_id() , 100 ); ?>
<h4>Article by <a href="<?php the_author_url(); ?>">
<?php the_author_firstname(); ?> <?php the_author_lastname(); ?></a></h4>
<p><?php the_author_description(); ?></p>
<p><?php the_author_firstname(); ?> has written <span><?php the_author_posts(); ?></span> awesome articles.</p>
<p>Subscribe to feed via <a href="http://www.fourblogger.com/feed"><b>RSS</b></a> or <a href="http://feedburner.google.com/fb/a/mailverify?uri=Fourbloggercom&loc=en_US"><b>EMAIL</b></a> to receive instant updates.</p>
<p>Subscribe to our fourblogger <a href="http://www.youtube.com/user/fourblogger"><b>You tube channel </b></a></p>
</div>
<?php }
}
add_action('thesis_hook_after_post_box', 'post_footer_author');
5. Then you should change your own RSS, Email, and You tube url.
6. Final step paste the below code into custom.css.
/* code for Author's profile box below the post */
.postauthor {background: #F5F5F5;
border-top: 1px solid #e1e1e0;
border-bottom: 1px solid #e1e1e0;
overflow: hidden; padding: 1.5em;
}
.postauthor img {border: 1px solid #e2dede;
float: left;
margin-right: 1.5em;}
.postauthor h4 {color: #666;
font-size: 2em; margin-bottom: 5px;}
.postauthor p {color: #515151; font-size: 13px;
margin-bottom: 12px;}.postauthor p.hlight {font-size: 11px;
text-transform: uppercase;}.postauthor p.hlight span {color: #CB3131;
font-size: 1.5em; font-style: italic;
font-weight: bold; letter-spacing: 0.8px;}
.custom .postauthor p {
fontsize:15px;}
.custom .postauthor p.hlight{
fontsize:13px;
fontweight:bold }
Share your experience in comment section below:
and For more checkout our all Thesis theme tutorials..
{ 48 comments… read them below or add one }
Yes. This is popular among thesis users especially blogs which have multi author or more guest authors use this option.
Namaskar,
when i watched your YouTube there i found you’re Indian blogger with a lot of mad skills..
Thank you for this author box tutorial..and maybe you will se my comments again and again until i have done my Thesis customization. Will tell you soon as my weblog is ready.
BTW, just wanna ask.. how to make “share with your friends like yours” its look cool
p/s: send my regards to Asin and Namrata Shirodkar.
For quick help, Use search box in navigation you will get your ans for your query.
see this link http://fourblogger.com/how-to-add-social-bookmark-button-links-in-posts/
Yes this is very useful and great post.Thank you so much.
Voted.
Thanks a lot.
Thanks Sandesh.
hi,pascal,i implemented it,but there is no background for that.it shows only text.help me
Ya surely i will help you..
thanks for doing it for me yourself.thanks for your help!!! as always fourblogger is helping blogger.
Thanks.
I have tried this from several different tutorials and none of them seem to be working correctly. My picture shows above the author info, there is no real “box”, the fonts are tiny, and the coloring of the box doesn’t seem to work either…. not sure what I could be doing wrong and I only started using thesis last week. Not sure what I could be doing wrong, I added the code by copying and pasting and I tried adjusting the fonts in the code, still nothing.
Thanks for the tutorials, I have used several that worked great.
hai Keith,
I saw your site. In your custom.css file you have placeed the code for logo
ie. .custom #logo a { }. In this code you have missed the close brace
}. That’s why author box and widgetized footer is not working. So add close brace in logo css code then your author box and footer will working fine.. if you have problem contact via contact form.Thank you so much Suresh, that fixed my footer issues I was having too.
A friend of mine started a forum just for bloggers (do-follow links too) and I was going to start a section just for thesis, would you be will to post tutorials there and answer questions if people ask them? http://bloggerluv.com/community
I will add the thesis topic on there today.
Thanks for giving this opportunity. Now i am engaged with some other works. after finishing that works, surely i will participate in your community. once again thanks.
hey, i cant find it working.. receiving some error like.. ”
Parse error: syntax error, unexpected ‘<' in /homepages/5/d238782941/htdocs/bloggerluv/wp-includes/default-filters.php on line 229
"
Hi Haja Peer Mohamed,
i saw your site. it is not thesis theme so you cant add author box with this thesis code. for your theme i already put post click follow link http://fourblogger.com/how-to-create-author-box-in-wordpress-blog/
Nice work!
ALso let me know how to do the same when using blogger? any reference sites?
Dude, I am using thesis with Blogussion theme. But this does not seems to work on that as it shows error on custom function file. Can u help me?
hai sukhjit singh,
First place the code in your site then only we can identify what is the problem you have and solve it..otherwise tell me clearly what error you get when you place the code..
The error is parse syntax error on some line…. It worked fine on Thesis normal but on blogusion one has problem.
hai,
we haven’t tested in blogusion skin..
Letting the world about the Author of a post is quite a popular trends of today’s blogging atmosphere. Thank you very much for providing a useful post to flow myself in this popular wave.
I added the code for author box mentioned on this post in my blog http://www.sfihomebizz.com. The box is appearing but the author box has distorted and pushed the sidebar to bottom of the page. While saving my firefox closed abruptly and the next thing I see this result on my blog. Can you please check my blog and help me out in this
hai,
This is not because of the author box code check your comment box code.. there is no css code available for your comment section.. adjust the comment width..
thanks suresh
Thanks for this Pascal!
Thank you sir, you tutorials are quick and easy, which is great when you have very little time to learn new things.
Keep them coming!
Here is the final result of your tutorial:
http://deysonortiz.com/blog/photography/photographers-find-out-who-has-been-using-your-images/
Deyson Ortiz
Great tutorial! I implemented this code. Its great
hai Jason,
Once again check do you have code in your custom function.php file or not..
I am not seeing ant ode in your site.
tell me where you are getting problem exactly…
Your Tutorials are absolutely amazing, you saving lots of headaches
Glad you liked it.
Pascal, how to change the avatar? Can you show me the way?
Thanks. Contact me via contact form, if you want my service on this work.
@ pascal :. nah..its ok.
Great info…i was wondering how to add author info….it has surely helped me a lot….thanks for sharing
Sir can you tell me the path of the FTP here ? i cant understand clearly in video
please i am waiting.
Go to /public_html/wp-content/themes/thesis_181/
Paste the code in custom_functions.php and custom.css
should the   be part of the css code? Your code is not working for me.
Does this get effected by the byline options? I have custom php to put the byline below the post? Great post, surprised Thesis doesn’thave this tutorial
I hope that I can somehow apply what I have read here.
Great thanks.
)
It works perfectly now.
Hi Suresh, I have the same problem with above person
“I have tried this from several different tutorials and none of them seem to be working correctly. My picture shows above the author info, there is no real “box”, the fonts are tiny, and the coloring of the box doesn’t seem to work either…. not sure what I could be doing wrong and I only started using thesis last week. Not sure what I could be doing wrong, I added the code by copying and pasting and I tried adjusting the fonts in the code, still nothing.”
Can you please help me on…Thank you so much!
hai Reeze,
In your custom.css file you have added
fontsize:13px;
fontweight:bold
Change fontsize into font-size
also fontweight into font-weight
Now you can adjust the values..
Just verify the css parameters and notation
Thanks.
HI Suresh, really appreciate your reply. I’ve altered the code. But still happened =(.
hai reeze,
check your custom.css file..
remove the below line
* code for Author's profile box below the post */otherwise add/in front of this line.Thanks.
hai Reeze..
Also remove the below two php lines from your custom.css file
remove_action('thesis_hook_after_header', 'thesis_nav_menu');add_action('thesis_hook_before_header', 'thesis_nav_menu');
Thanks
HI suresh, you make my day! Thank you so much =).
Hello,
I had one question. I am trying to ad extra writing on the authors box. For example like a few about me sentences and what I like. How do I go about doing that? Thanks in advance!
-Ronald
so nice tips. but i cant add it to blogger