Oct 21, 2015

Add 3 Column Footer Bar To Blogger

data:blog.title
Wondering How To Add Footer Bar To Blogger then you are on right platform because today we are going to share How To Add 3 Column Footer Bar To Blogger.
How To Add 3 Column Footer Bar To Blogger

Footer Bar is a must widget in every blogger templates because By using Footer widget we can Add different Elements to footer bar like About Us, About Blog, Subscription Widget, Facebook like box, Twitter follower box and many other widgets.

So if you want to add footer bar to your blogger template then follow all steps below one by one.

Steps For Adding 3 Column Footer Bar To Blogger

  • Go to blogger Dashboard.
  • Click On Edit HTML

Note: (Before Doing Any Editing Make sure Backup your template first.)

  • Add Check Mark in Expand Widget.
  • Find this code by Pressing CTRL+F <b:section class='footer' id='footer'/>
  • Replace <b:section class='footer' id='footer'/> With Below Code.
<div id='footer-column-container'>
<div id='footer2' style='width: 30%; float: left; margin:0; text-align: left;'>
<b:section class='footer-column' id='col1' preferred='yes' style='float:left;'/></div>
<div id='footer3' style='width: 40%; float: left; margin:0; text-align: left;'>
<b:section class='footer-column' id='col2' preferred='yes' style='float:left;'/>
</div><div id='footer4' style='width: 30%; float: right; margin:0; text-align: left;'>
<b:section class='footer-column' id='col3' preferred='yes' style='float:right;'/></div>
<div style='clear:both;'/><div id='footer-bottom' style='text-align: center; padding: 10px; text-transform: lowercase;'>
<b:section class='footer' id='col-bottom' preferred='yes'><b:widget id='Text2' locked='false' title='' type='Text'/>
</b:section></div><div style='clear:both;'/></div>

  • Now Find This Tag ]]></b:skin> By Pressing CTRL+F.
  • Paste Below Code Just Above Of ]]></b:skin> tag.
/* Footer by www.mybloggerguides.com */
#footer-column-container {clear:both;}
#footer-column-container h2{font-size:18px;text-align:left;color:#ddd;Times New Roman&quot;,Times,serif; font:normal bold 18px Arial,Georgia,&quot;text-transform:none}
.footer-column {padding: 10px;}

  • Now Save Your Template.
  • That's it. You have added this footer bar to blogger blog. 
  • Now Go To Layout section and add some widgets to footer bar and that's it.

Conclusion:

So above guide is about How To Add 3 Column Footer Bar To Blogger and i hope by this complete guide you can easily add this widget to your blogger template. If anyhow problem persist after following all steps carefully then drop a comment below, we will help you. Don't forget to share on blogging communities and with your blogger Friends.

No comments:

Post a Comment

We’re eager to see your comment. If you have any query related to the topic then drop a comment below. We will help you out of sure. However, Please Keep in mind that all comments are moderated manually by our human reviewers. According to our comment policy all link are nofollow so keep in mind that never use links in comments, we consider link comments as a spam.