How to Display Author Profile in every Blogger Blog Post

If you are an author of any blogger blog and write articles on various topics, you may would like to show your name and profile photo with some introduction in each blog post.

By default Blogger BlogSpot Blog displays the only name of post author with link to the blogger blog author profile (if not linked to Google+) at the end of each blog posts. But, many bloggers want to display their name at the top of every article and a short author bio with image and name below each blog post.

However, if you have customised your blogger template or using third party downloaded free blogger templates then it may be possible that the author profile is not working for your blog. So, please read this article very carefully and enjoy the right to show your name with intro in each article/posts.

• How to show Author Profile Name on the top in each blog post

1. Sign-in to your blogger account and click on your blog name or go to the dashboard.
2. Click on Layout tab menu from left sidebar
3. Click the Edit link of Blog Posts widget.
4. Now, check the Posted by option box under Post Page Options and save the widget.

You may change the words “Posted by” with the words you want to display like “Written by” or “Author” etc.

• How to shift the Author name from bottom to top of blog post

First of all visit your blog dashboard and navigate to the layout option and then click on Edit link of Blog Posts widget which is the biggest one among other blogger gadgets.

Now, scroll down to see arrange items and then click and drag the author (posted by) box just above the Post Body.

However, if the above process not working for your blog or you want to show a customised author name with image then use the following tricks.

• How to show Customised Author Profile Name on the top in each blog post

Go to the Edit HTML template of your blog and search for ]]>

 and paste the following CSS codes just above/before it.

/* code begin */

.swt-author {

background-color: aliceblue;

font-weight: bold;

border-top: 1px solid #321;

border-left: 2px solid #000;

border-right: 2px solid #000;

border-bottom: 1px solid #123;

overflow: auto;

}

.swt-author name {

display: inline-block;

font-size: 15px;

float: left;

text-align: center;

margin: 5px;

white-space: nowrap;

}

.swt-author name a {

font-style: italic;

color: #fff;

background-color: #000;

padding: 12px;

padding-top: 1px;

padding-bottom: 2px;

/* code end */}

Now, search for

class='post-header-line-1'/>

You will see the same line in two places of your blogger templates. Don’t worry the first one is for mobile templates and the last one is for desktop templates. Therefore just below/after both the lines paste the following HTML codes so that all visitors will be able to see the author name.

<!—Custom Author Name by www.superwebtricks.com -->

<div class='swt-author'><name> Author

<a expr:href='data:post.authorProfileUrl' rel='author' title='author profile'>

<span itemprop='name'><data:post.author/>

</span></a>

</name></div>

Save your template and enjoy!

• How to display Author Profile below every blog post

1. Login to the blogger account and go to the dashboard of the blog.
2. Click on Layout tab menu from left sidebar and then click the Edit link of Blog Posts widget.
3. Now, check the Show Author Profile below post option box under Post Page Options and save the widget.

However, if the above process not working for your blog or you want to show a customised author profile with image then use the following tricks.