Blogger Ever

How to customize "About Me" widget in Blogger using CSS?


About Me widget is a widget that display the author details in sidebar or desired location in the blog ; of single person or a team.For personal bloggers their is a strong reason to throw up this widget, that is to describe the author and to connect Google Plus profile with it.A few reason why to customize the About Me widget?
  • Fits with your template.
  • Look better than before one.
  • Helps to highlight the author and its description.
As you can see in the banner image the widget looks fine and better than previous one because a bit of CSS has been changed.Before revealing the code let me tell you the basic of this widget.This widget connects your Google Plus profile with your blog,since it is connected with Google Plus hence your description that you added on Google Plus settings will be shown here.

Secondly,you make sure that whatever your description is looks good and fits with your blog and personality as many viewers looks them.The follow button is already added so you no need to worry about that.

Copy and paste the code just before //]]></b:skin>
/* Customization Of Blogger About Me Widget By bloggerever.com */
.Profile .widget-content {
    background: #fff;
    padding: 15px;
    box-shadow: 1px 1px 2px rgba(0, 0, 0, 0.2);
    -moz-box-shadow: 1px 1px 2px rgba(0, 0, 0, 0.2);
    -webkit-box-shadow: 1px 1px 2px rgba(0, 0, 0, 0.2);
}
.Profile .widget-content>a {
    display:block;
}
.Profile .widget-content>a img {
    border-radius: 50%;
    box-shadow: 2px 2px 2px rgba(0, 0, 0, 0.2);
    width: 80px;
    height: 80px;
    display: block;
    margin: 0 auto;
    float: none !important;
    clear: both;
}
.profile-textblock {
    font: 600 12px'open sans', sans-serif;
    color: #666;
}
.profile-link {
    font: 300 13px'open sans', sans-serif;
}
.profile-data .profile-name-link {
    color: #666;
    background:none !important;
    text-align: center;
    margin: 0px auto;
    display:block;
}
.profile-data #___follow_0 {
    margin:10px auto !important;
    display:block !important;
}
Few more Blogger custom widgets customizations articles are on the blog some of them are:
Blogger

2013-2016 Copyright Blogger E\ver . Coded, managed and founded by Mohammad Hamza (@hamzadhamiya) . Hosted on Blogger and fonts used are Raleway and Open Sans.