You have a blog with many authors who contribute content ,and you want to show their short bio in credit box at the end of each post . This idea was in Wordpress for a long time ,but not in Blogger . I tried several times ,but none of them work . Thanks to comment of
ابن الملكـةHe gave me a code that work in a comment ,and now I want to share this code here .Both of me and ابن الملكـة hope this code helpful to you all ,and make Blogger to be the best of blogging platform .
Here is what we need to do :
1,First ,you find this line
<data:post.body/> and then paste the following code right after the line above.
<div style='clear:both'/> <div id='creditbox'> <!-- Author Bio info start--> <b:if cond='data:blog.pageType == "item"'> <!-- First Author Info --> <b:if cond='data:post.author == "NAME OF FIRST AUTHOR"'> <img class='authoravatar' height='39' src='IMAGE URL FOR FIRST AUTHOR' width='39'/> <div class='postauthor'> <h3><a href='FIRST AUTHOR'S URL'>NAME OF FIRST AUTHOR </a></h3> <p> NOTES ABOUT FIRST AUTHOR </p> </div> <div style='clear:both'/> </b:if><!-- Second Author Info --> <b:if cond='data:post.author == "NAME OF SECOND AUTHOR"'> <img class='authoravatar' height='39' src='IMAGE URL FOR SECOND AUTHOR' width='39'/> <div class='postauthor'> <h3><a href='SECOND AUTHOR'S URL'>NAME OF SECOND AUTHOR </a></h3> <p> NOTES ABOUT SECOND AUTHOR </p> </div> <div style='clear:both'/> </b:if>....................... </b:if> <!-- Author Bio info End--> </div><div style='clear:both'/> Notes :1- NAME OF FIRST AUTHOR : replace this with name of your first author . Name of author must be as exact as name showed in profile .2- NAME OF second AUTHOR :replace this with name of your second author3- IMAGE URL FOR FIRST AUTHOR :Replace this with the link to your first author avatar or image .4- IMAGE URL FOR second AUTHOR :Replace this with the link to your first author avatar or image.5- NOTES ABOUT FIRST AUTHOR : Replace this with author short bio ,profile ...6- NOTES ABOUT second AUTHOR : Replace this with author short bio ,profile ...7- FIRST AUTHOR'S URL :Replace this with link to author profile page or link to a social network account.8- SECOND AUTHOR'S URL :Replace this with link to author profile page or link to a social network account.In case of there are more than one
<data:post.body/> in the search result ,you can paste this code right after all the results .
If you have more than two authors ,you can duplicate the code of first author's information or second author's information and then change the name,link,bio...
2,Add this CSS code before
<body> to decorate the credit box :
<style> #creditbox { background: none repeat scroll 0 0 #EDEDED; padding: 10px; margin-top:10px;} .authoravatar {float:left;margin-right:10px;padding:4px;background:#fff;border:1px solid #f0f0f0;} .postauthor {float:left;} </style>This is an example .You can add more CSS tags to make the credit box display as you want .
Here is my credit box in Simplex Celebrity template
That's all for making credit box in a multi-author blog .Thanks
ابن الملكـة again for this helpful tip .
Posts
