How to Add Three Columns To Your Blogger Footer Section. 0

| | , , ,

 How  to Add Three Columns To Your Blogger Footer Section.

Hey! Friends do you know how to add 3 Columns  to your blogger footer section..many websites and blogs has three column footer.  footer section will provide more valuable space for blog widgets, and also contribute a modern "Web 2.0" appeal for your blog design. there are only 6 steps to do this..this footer hack is specially for blogs that have different  widths and styles.ok..try this very easy tutorial.. i hope you like this blogger hack..thankyou..

1.Log in to your Dashboard--> Desing- -> Edit HTML

2.Click on "Expand Widget Templates"

3.Scroll down to where you see this






<div id='footer-wrapper'>

<b:section class='footer' id='footer'/>

</div>


4.Replace the line <b:section class='footer' id='footer'/> of above code 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;'/>
<p>
<hr align='center' color='#5d5d54' width='90%'/></p>
<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>

5.Now find the </b:skin> tag in your template.

6.Immediately before above line, add the below lines of code

#footer-column-container {
clear:both;
}

.footer-column {
padding: 10px;
}

7.Now Save Templates,Your Are done

StumpleUpon DiggIt! Del.icio.us Blinklist Yahoo Furl Technorati Simpy Spurl Reddit Google I'm reading: How to Add Three Columns To Your Blogger Footer Section. ~ Twitter FaceBook

0 Responses So Far:

Categories

Select Your Categories
Access Denied Adsense Adspace Alexa Rank Animation Avatars Background Backlink Baidu Beginner Guide Best Gadget Birthday Emoticons Blogger Templates Bookmarking Site Bookmarks Brands Avatars Browser Button Buttons CSS CSS3 Menu Change Template Coding style Comments Computer tips Content Slider Cookies Cursor Cute Emoticons Design Domain parking Domain vs Debit Email FEED Favicon Featured content Flash Footer Forum Code Converter Free Domain Free Internet GoDaddy Google Gtalk Emoticons HTML HTML Color Generator HTML to JavaScript converter Header Html Encoder Image Image Gallery Internet Internet Business Java Script Jquery Labels Lable Link Popularity META TAG Magic Html Encoder Magic Zoom Marquee Menu Generator Meta Tags Mobile Reviews Money Tips MooTools Navigation Menu Page Locker Page Navigation Page Peel Photoshop Popup Box Post Print And PDF Related post SEO TIPS Search box Sitemap Social Media Stop Copy TWITTER Text Boxes Text effect Title Tutorial URL Shorten Web Directories Widget Wordpress Yahoo Youtube