Customize Blogger Profile (Blogger)

Have you ever think about to customize your profile data shown on your Blog ? Your profile describes everything about you and your blog, so according to this point of view, it should be attractive. Let us know how to customize profile data shown on blog by adding some simple codes to template. Take a brief look of my customized blogger profile to know more about it, Here.

Note:- It is always wise to take a backup copy of template before editing it to avoid any mistakes. To know how to take a back up copy of template, visit here. 

1. Log in to Blogger Dashboard.

2. Design» Edit HTML»Expand Widget Templates.
3. Search code  ]]></b:skin>
4. Just above ]]></b:skin> paste the codes-

.profile-img { float: left;
margin: 0 5px 5px 0;
padding: 4px;
border:1px solid #1493F8; }
.profile-img:hover {
border:2px solid #1CBEF5; }
.profile-data {
margin:0 10px 20px 10px;
padding:0;
font: bold 10pt "ms sans serif", verdana,Arial;
color:#488AF0;
line-height: 1.6em;
text-align:left;
text-transform: uppercase;}
.profile-data:hover {
color:#FAA20D; }
.profile-datablock {
margin:.5em 0 .5em; }
.profile-textblock {
color:#333;
margin: 0.5em 0;
line-height: 1.6em;
padding:5px 0 5px 0;
border-top:2px solid #66A6F8;
border-bottom:2px solid #66A6F8;
text-transform: uppercase;}
.profile-link { display:none; }

5. Take a preview and save template to finish the process.

Variables:- You can change padding, text color, border size and color. You can use color code generator to find out more suitable color, Here

Baca juga