|
|
|
It is pretty common that you might have seen all the professional blogger templates would possess a three column footer where in, they add details about their site or an about me widget and lots more. I recommend you to add this feature in your blog to make it more professional. You may scroll down the page to have a look at the bottom of the page to have a look at this widget which contains Popular Posts, Useful Resources, Blog Archive and Recent Comments. Hope, you got an idea about what a three column footer is.
To add this stylish three column footer to your blog, just follow these simple steps. As we always ensure safety, the first step would be to back up your template. To do this, simply navigate to "Design->Edit HTML and make a backup of your template clicking on the "Download full template" link at the top of the page. Once the back up is over, follow these simple steps.1. Search for the following text in your blogger template. To fasten your search, use "CTRL+F".
]]></b:skin>
2. Download the following text document : Three Column Footer One. Just paste the code in the document above the line mentioned in step 2.3. Search your template for the following text.
</body>
4. Paste the following piece of code above it.<div id='footer-wrapper'>
<div id='lower-wrapper'>
<div id='lowerbar-wrapper'>
<b:section class='lowerbar' id='lowerbar1' preferred='yes'>
</b:section>
</div>
<div id='lowerbar-wrapper'>
<b:section class='lowerbar' id='lowerbar2' preferred='yes'>
</b:section>
</div>
<div id='lowerbar-wrapper'>
<b:section class='lowerbar' id='lowerbar3' preferred='yes'>
</b:section>
</div>
<div style='clear: both;'/>
</div> </div>
(Note: You may paste the above code in the place where you want the footer to appear. It is ideal to place this section before the credits section in your blog.)<div id='lower-wrapper'>
<div id='lowerbar-wrapper'>
<b:section class='lowerbar' id='lowerbar1' preferred='yes'>
</b:section>
</div>
<div id='lowerbar-wrapper'>
<b:section class='lowerbar' id='lowerbar2' preferred='yes'>
</b:section>
</div>
<div id='lowerbar-wrapper'>
<b:section class='lowerbar' id='lowerbar3' preferred='yes'>
</b:section>
</div>
<div style='clear: both;'/>
</div> </div>
5. Now, save your template and your ready with the footer section. Add any widget you want. Feel free to comment or contact me via Email for any assistance that you need to install this feature. I would be happy to help you!! See you soon in my next post!!!
Click here to subscribe to FREE email updates from "Everything About Blogging", so that you do not miss out anything that can be valuable to you and your blog!
It not works...i tried yesterday
REPLYThank you so much for this EASY way to add a footer column. I've tried zillions (it feels like that at least trying to add extra footer space...I have a very complicated custom design. again, Thank you SO much!!!
REPLYHere is another way to add a 3 column add a gadget footer http://fsadvisor.blogspot.com/2010/02/add-thr33-column-widget-footer-to-your.html
REPLY@Anonymous(http://www.photos2news.com/): Please let me know what problem you faced and I will help you out. It works perfectly. I have it running in my blog!!
REPLY@Wendy: You are always welcome. Just keep track of the blog to get more tips!!
REPLY@Faheem Mustafa: Yeah!! Checked it out!! It will work!! But I feel this one will look more stylish than the one present in yours!!
REPLYYup I agree. The one you shared is stylish.
REPLYI was browsing through your links but Contact Me link isn't working.
I wanted to have a link exchange with you. Do inform me ...
Text: Software Encyclopedia
Link: http://fsadvisor.blogspot.com
Mukund I need your help. I just downloaded WoodMag blogger template. It is a perfect template for me. But the problem is in the "Old Post", "Home" and "New Post" links in it. I can't find it. But later on I realized that is near to the top post title. you can see small letters, take a close look near to the categories here http://woodmag-ipietoon.blogspot.com/2009/07/test-image.html. You can see a part of H and all. How can I bring that to the bottom as seen in all other blogs. Please help me mukund.
REPLY@Faheem Mustafa : Yup!! I will check it out. I initially had a post about the contact me but later once blogger introduced the page option, I shifted to that. I will check out. You may contact me via email. My email id is smalwayz@gmail.com
REPLY@Arun: Ya!! I had a look at your blog. I need to check your coding to solve the problem. Did you expand your template and find out where the home and other links are placed??
REPLYHi Mukund. I need help. I am using woodmag blogger template. In your template, shows date and day on top. May be its default for revolution church. I need one like this to put in my template (woodmag). How can I do that. Also How to change the case of font in the second nav bar in woodmag? I used upper case letters, but not changing.
REPLYI also need to change the side bar widget title in my woodmag template as yours. I mean black background color with bold white font. It is there in woodmag post title. But widget title is plane. I need to change it too. Can you help in changing the code for that too.
REPLY@Arun: Please let me know your problems one by one and I will definitely help you. So, tell me the first problem clearly and send me your coding if possible to my email address(smalwayz@gmail.com)
REPLYi don't have a footer column at all...i'm trying to add only one column in the footer so that i cand add a text widget for links...do you think you cand help me out? the blog is: http://www.watchtheboondocksonline.org/
REPLYplease answer to this comment because i forgot to check the e-mail follow-up ... 10x
REPLY@Boby Bratu: Thanks for the comment first! Yeah! I can help you with the installation. Send in your customization help precisely to smalwayz@gmail.com!! Else, view "Our Services" page on top right corner of blog and send in your details.
REPLYthank u very much. bobybratu
REPLYthank u very much. bobybratu
REPLY@Faheem Mustafa : Yup!! I will check it out. I initially had a post about the contact me but later once blogger introduced the page option, I shifted to that. I will check out. You may contact me via email. My email id is smalwayz@gmail.com
REPLYYup I agree. The one you shared is stylish.
REPLYI was browsing through your links but Contact Me link isn't working.
I wanted to have a link exchange with you. Do inform me ...
Text: Software Encyclopedia
Link: http://fsadvisor.blogspot.com
Hi mukund,
REPLYI tried your hack but the out-put is in other way(u can see the pic)
"http://myimgs.net/images/dxbn.jpg".
I use "ads theme" template.I wish to mail u about some modifications of my template and some other request.
@Anonymous: Thanks for the comment first! Did you try adding some widgets on each block as shown in the screen shot? Contact me via email at smalwayz[at]gmail.com regarding your modifications and I will help you!!
REPLY@Mukund
REPLYI had sent an mail regarding my template modifications, pls check it
@Anonymous: I replied to your mail buddy! Check your inbox:)
REPLY@Mukund
REPLYThnkx 4 ur reply met!
I hate exams :D
You had not answered to my link request.
@Anonymous: Same here!!! I will check your site and then let you know about the link exchange. Will reply along with the mail after my exams are over.
REPLYGreat tip and easy to add to blogger I added it to fabtechguy.com and was happy with the results, thanks
REPLY@Troy Janda: Thanks for the comment buddy! I hope you enjoy the other tips on my blog as well! I published an article about the thesis footer too! You may like it, so go check it out!
REPLYHey Mukund your blog rocks.
REPLYn I've noticed u're active with ur blog.
+1 to u :)
I tried adding this column footer to my blog but the width of this column footer theme is large w.r.t my blog.
Can you please help me reducing the width of this footer ?
Also, the colur 'black' of this footer does not suit my blog.
If u could provide me with the footer similar to http://www.bloggerplugins.org ,it would be gr8.
my blog url : http://www.latestnewssavvy.blogspot.com/
Thanks a lot
@Sagar: Thanks for your comment! Well, I can provide the same but to design the footer like blogger plugins it would cost a few pennies. So, if you want it, let me know. Else mail me and I will help you with the existing footer!!!
REPLY@mukund thanx for just a fantastic share...but pls tell how to increase the font size of of elements of widget(i know its lil bit stupid) and how can i remove that underline effect on that links on popular posts or whatever i posts......quick reply would be appreciated
REPLY@Anonymous: Just contact me via email and I will help you out with this issue! It involves some CSS. By the way, thanks for your comments!
REPLYThanks a lot bro. Awesome content. All the other conntents was for to change the footer quantity but yours is for adding. And that's what I needed :)
REPLYMy SEO thoughts
@duke: Yup! Thanks for the comment duke! I hope you enjoy the other tutorials on our blog as well!
REPLYXML document structures must start and end within the same entity.
REPLYthats what it says. can someone tell me how to fix it (e-mail me at crisa_itgirl@yahoo.com, please)
@Crisa: Email sent! Check your inbox buddy! I hope I can fix your issue:)
REPLYhello, thanks.. i edited my new blog footer, & its looking very nice...
REPLY@IndyaTech: That's great! Glad to know that your blog looks much better now! Hope you enjoy the other widgets/tutorials on my blog as well!
REPLYThanks Mukund, it worked perfectly on my blog where others failed to work
REPLYhi...i have applied this 3 widget footer to my blog but it is appearing after the attribution.. :( can you please see to it :(
REPLY@shubham@Tricks Treasure: Please make sure you place the HTML tags properly. Still facing problems, let me know and I'll fix it up!
REPLY@Mukund Hello mukund..i have crosschecked everything now...and placed everything exactly as written above! :( but still its appearing after the attribution :(
REPLY@shubham@Tricks Treasure: Just hit me via my email id and I'll try to help you out!
REPLY@Mukund sent u a request on gtalk :)
REPLYUse the tab below to comment. No spam please!!!
POST YOUR COMMENT