How to Add Author Bio Box Below Posts in Blogger (2025 Stylish Version)

How to Add Author Bio Box Below Posts in Blogger (2025 Stylish Version)

Boost trust and branding with an author bio box below each Blogger post. This 2025 guide shows you how to add a stylish author section with image, name, and social links.

Why Add an Author Bio Box?

An Author Bio Box is a section at the end of your blog post that introduces the writer. It typically shows:

Name
Profile picture
Short bio
Social media links

Benefits of an Author Box

Benefit	Why It Matters
Builds reader trust	Shows who’s behind the content
Improves authority	Personal branding for guest or solo blogs
Increases social following	Adds clickable links to social profiles
Boosts engagement	Encourages comments & connections

---

How to Add a Simple Author Bio Box in Blogger

Step 1: Go to Blogger → Theme → Edit HTML

Step 2: Add CSS Style Before </head>

Paste this just above </head>:

<style>
.author-box {
  background: #f9f9f9;
  border: 1px solid #ddd;
  padding: 15px;
  margin-top: 40px;
  display: flex;
  align-items: center;
  border-radius: 10px;
}
.author-box img {
  width: 80px;
  height: 80px;
  border-radius: 50%;
  margin-right: 15px;
  object-fit: cover;
}
.author-box .info {
  flex: 1;
}
.author-box .info h4 {
  margin: 0 0 5px;
}
.author-box .info p {
  margin: 0;
  font-size: 14px;
  color: #555;
}
.author-box .social a {
  margin-right: 10px;
  color: #007bff;
  text-decoration: none;
  font-size: 16px;
}
</style>

Step 3: Add Author Box HTML Below Blog Posts

Search for:

<data:post.body/>

Add this immediately after it:

<div class="author-box">
  <img src="https://i.imgur.com/yourimage.jpg" alt="Author Image">
  <div class="info">
    <h4>Inuwa Sulaiman</h4>
    <p>Inuwa is the founder of AndroidPols.com.ng — sharing tech guides, mobile tips, and blogger tutorials for Nigerian creators.</p>
    <div class="social">
      <a href="https://facebook.com/androidpols" target="_blank">Facebook</a>
      <a href="https://youtube.com/@androidpols" target="_blank">YouTube</a>
    </div>
  </div>
</div>

Replace:

• yourimage.jpg with your profile photo URL
• Update name, bio, and social links as needed

Pro Tips

Tip	Why It Helps
✅ Add rel="author" for SEO	Helps Google connect authorship
✅ Use circular image	Looks cleaner and modern
✅ Customize by author (multi-user)	Different bios for guest contributors

---

Common Mistakes

Mistake	Solution
❌ Image not displaying	✅ Use direct image URL (.jpg/.png)
❌ Poor formatting	✅ Check placement after <data:post.body/>
❌ Broken social links	✅ Test all links after publishing

Adding an Author Bio Box to your Blogger blog:

• Enhances professionalism
• Builds trust with your audience
• Increases clicks to your social profiles
• Helps you stand out in the blogging space

Related Posts:

Previous article

Next Post

Next article

Previous Post

Suleiman Inuwa

https://www.androidpols.com.ng/

I am a professional website developer and also an SEO expert.