Stylish Custom About Author Bio Widget for Blogger

Author widget is the most essential gadget that every blog must have one. This author profile gadget allows site visitors to know the person behind a blog or website.

Custom about  author widget

Unlike, other blogging platforms, blogger already have an official author profile widget, which can be used to display your BlogSpot profile or Google+ profile. Both of these profiles are good, but not better, because it has the old classic style look and has not been upgraded since Google launched blogger.

Even I was using the classic style on my blog for a long time. But, soon enough, I realized that it did not attract my visitors. So, I removed the official profile gadget and replaced it with my own custom author profile. Here’s how it looks like:

about author blogger gadget

This profile bio widget can be used in every blog on blogger platform, and the best part about this is that creating this gadget is quite easy, no third-party codes integration at all. It is super fast loading and mobile friendly too.

The basic requirement for getting started is nothing much, but a profile picture or your blog logo is enough.

How to Add Stylish Custom Author Profile Gadget in Blogger

Below is the full tutorial for adding the custom profile widget in blogger. Just follow my footsteps:
1. Login to your Blogger account, click on Pages and press on “New Page”.

Profile Gadget in Blogger

2. Now, write anything or whatever text you want to show on your profile. For your ease, I have written a few author profile lines. Just copy and paste the piece of text on the blank page.

The goal of "your Blog name" is to provide you high-quality, relevant and the most accurate based contents, tools, "write your own categories, i.e, How-to tutorials on Blogging, SEO, Make money Online, social media, WordPress, Blogger, YouTube and more. Read About Us page to know more about us.

3. Click on the upload image icon and upload your profile picture or blog logo. After uploading the image, click on it and set it in the smaller size.

author bio Gadget

4. Add any hyperlinks, bold, italic, underline, or change font colors and font style, if you want. For example, you can insert contact us page link, or about us page link in the texts. 5. Click on “Save”, and press on the “HTML” Mode.

Adding profile bio gadget Blogger

6. Now, you need to insert animated social media follow us icons right after the description. Copy the following codes and paste it on your site after the description and change the blue color texts with your actual URL.

<div id='socialfontawesome'>

<a href='
your Facebook
Profile or Page URL goes here' rel='nofollow' target='_blank' title='Facebook'><span style='color: #037dd3'><i class='fa fa-facebook-official'></i></span></a>

<a href='
your Twitter Profile URL goes here' rel='nofollow' target='_blank' title='Twitter'><span style='color: #03b5e1'><i class='fa fa-twitter-square'></i></span></a>

<a href=
'your LinkedIn Profile URL goes here' rel='nofollow' target='_blank' title='linkedin'><span style='color: #027aa1'><i class='fa fa-linkedin'></i></span></a>

<a href=
'your Google+ Profile URL goes here' rel='nofollow' target='_blank' title='Google Plus'><span style='color:#ef4343'><i class='fa fa-google-plus-square'></i></span></a>

<a href=
'your Pinterest Profile URL goes here' rel='nofollow' target='_blank' title='Pinterest'><span style='color:#ba0120'><i class='fa fa-pinterest-square'></i></span></a>


7. Press on the “Compose” tab, and again click on the “HTML” mode and copy all the HTML Codes and close the page.

Add about author in Blogger

8. Now we need to paste the copied codes into the HTML/JavaScript widget on your blog. Go to “Layout” Page, click on “Add a Gadget” in the footer area and choose the “HTML/JavaScript Gadget”.

inserting Profile widget in Blogger

9. Paste the piece of code that we copied earlier, and press on the “Save” button.

Addi author Profile bio Gadget

Congrats! You have successfully inserted the custom author profile widget in blogger, without any third-party code integration.
This about author widget is fully mobile-friendly and super fast loading because it does not contain any Script or any external codes.
In this gadget, you can also change the image border style according to your choice, like you want the rounded border or square border image and customize the description according to your need and it contains follow us buttons, so your visitors will easily able to find your profile on Social Media with a single click.

Thank you for reading this article, if you like it then please share this content with your friends, family, and colleagues.

1 thought on “Stylish Custom About Author Bio Widget for Blogger”

Leave a Comment

Your email address will not be published. Required fields are marked *