In this tutorial i will show you how to easily add Three Column Footer Gadget in blogger. Best blogging tricks are always easy and customize or make many changes easily. To make Blogger beautiful or Good Looking we should spend a lot of time on our blog or website. If you want a lot of visitors daily on your blog or in these visitors you want some visitors are returning people then put all your focus on your blog looking means make best and stunning blogger. When some one visit your blog then he/she just shocked to see your blog and say "What a Nice Blog". Now i am going to tell you how you can easily add the footer widget/gadget in your blog bottom easily with simple tricks. When ever you start blogging your focus should be on SEO, Good Looking Blog, Best Internal Linking, Best Google Page Rank, Good Strength Of Backlinks and Best Alexa Ranking. I have write many post on Manage Page Layout for better blog looking. If you want to also make beautiful blog then start with first adding widget or gadget in blog then add this below footer widget in blog it is the last step of manage page layout.
How Easliy/Simple To Manage Page Layout In Blogger Blogspot
How I Make My Blogger Good Looking Best Tricks
How To Make Website Like My Blogger Tricks To Get Best Alexa Rank
Widget And Gadget For Blogger Add Easily:
First Adding Widget In Layout.
1) Add Manually CSS Jqeury Drop Down Menu Blogger
2) Add Facebook Page On Blogger
3) Make Blogger Header Image
4) Add Categories Link Blogger
5) Add Recent Post Moving In Down And Upward Direction
6) Add Twitter Updates Gadget To Blogspot Blogger
7) Add PayPal Donate Button To Blogger To Make Money
8) Add Flickr/Picasa Web/Photobucket/Other Albums Slideshow
9) Live Traffic Counter Feed To See Visitors
10) Run And Float Text Line On My Blog For News Or Other Thing
Second Adding Widget Or Gadget In Template:
First If you can't work before with New HTML Interface then first introduce yourself with this new feature and then work easily. Handle New Interface Of Blogger HTML Editor
1) Social Bookmarking Button Add To Blogger
2) Read More Button In Blogger Post With Jump Break Feature
3) Add Next Page Or Previous Page Navigation Number In Blogger
4) Add Facebook Like Button in Blogger Post
5) Reduce My Blog Page Loading Time
6) Add Blog Table In Blog Post Blogger
7) Add Copyright Warning Message In Blog Post To Save Content
8) Add Put HTML Color Code Generator Tool To Your Blogger
 |
| Add | Put | Embed Three Or Four Column Footer Widget/Gadget In Blogger Blogspot |
Now Let's Start The Four Column Footer Adding:
If you want to add the four column footer in blog layout by adding gadget then work according to below tutorial.
Go to Blogger.com.
Go to Template.
Go to Edit HTML.
Now first download your full template in your computer before make changes any time.
Press Ctrl+F in HTML body box. Like i tell in article of Handle New Interface Of Blogger HTML Editor.
Paste this below Code in the search box and press enter.
]]></b:skin>
Now paste the below CSS Code just above/before this code.
/* ----- LOWER SECTION ----- */
#lower {
margin:auto;
padding: 0px 0px 10px 0px;
width: 100%;
background:#333434;
}
#lower-wrapper {
margin:auto;
padding: 20px 0px 20px 0px;
width: 960px;
}
#lowerbar-wrapper {
border:1px solid #DEDEDE;
background:#fff;
float: left;
margin: 0px 5px auto;
padding-bottom: 20px;
width: 32%;
text-align: justify;
font-size:100%;
line-height: 1.6em;
word-wrap: break-word;
overflow: hidden;
}
.lowerbar {margin: 0; padding: 0;}
.lowerbar .widget {margin: 0; padding: 10px 20px 0px 20px;}
.lowerbar h2 {
margin: 0px 0px 10px 0px;
padding: 3px 0px 3px 0px;
text-align: left;
color:#0084ce;
text-transform:uppercase;
font: bold 14px Arial, Tahoma, Verdana;
border-bottom:3px solid #0084ce;
}
.lowerbar ul {
margin: 0px 0px 0px 0px;
padding: 0px 0px 0px 0px;
list-style-type: none;
}
.lowerbar li {
margin: 0px 0px 2px 0px;
padding: 0px 0px 1px 0px;
border-bottom: 1px dotted #ccc
}
Save Template.
You have done.
Improve Content Keywords Significance
Use Custom Robots Tags Selection Blogger For SEO
Best Blogger Tips And Tricks For My Blog SEO Instantly
Add Lower Wrapper Lower Bar Widget From Lowerbar1 to Lowerbar 3 or 4:
By adding Lower Wrapper and Lower Bar we see three or four Add A Gadget Links in the page layout where you can easily add which you want like Blog Author Info, Blog Followers, Google+ Followers and many more option. Now we are going to add this Gadget in template and then go to Layout to check this out.
Go to Blogger.com.
Go to Template.
Paste below tag in search box and find.
</body>
When you find this above tag then copy below code.
Paste below code just above/before this </body> tag.
<div id='lower'>
<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>
Again Save Template.
Your Work is finished and your three column footer is ready for work and if you want to four footer then simply add below code above last two highlighted red background lines correctly.
Make Money Form Links of Amazon Product to Blogger Posts
You Put Chitika Ads to Blogger Blogspot with Simple Steps
Easy | Best | Simple Tricks To Make Money From Youtube | Chitika
<div id='lowerbar-wrapper'>
<b:section class='lowerbar' id='lowerbar4' preferred='yes'>
</b:section>
</div>
And give the lowerbar4 name with your choice number.
Changes And Customization For Footer Column Widget By Color:
If you want to customize or change the color of background text and width and many more then generate the color by using below Color Code Generator Tools and use according to above tutorial.
Color Code Generator Tool:
Change the Background color of your desire by replace the #333434
Change the Widget Width with your desire by replace the 960px
Change the Background 2 color by replace the #fff
Change the Widget Width 2 by replace the 32%
Change the of Text by replace the #0084ce
Change the Font of Widget just add desire font font: bold 14px Arial, Tahoma, Verdana;
border-bottom:3px solid #0084ce
Change the Bottom Border Dotted by replace the #ccc.
Now save template and go to layout and check in the footer of your Page Layout you will see three or four column just add which you want and your blog make perfect and beautiful.
Related Articles:
Ready to Make Money With Adsense Keywords and Blogger
Affilate Banner Put Below in your Blogger Post
The Best Placement of Adsense On Your Blogger Blogspot
How To Increase The Website Ranking From Social Bookmarking Sites
How to Verify My Blogger Blogspot in Webmaster Tools
How Use Social Website To Increase Your Website Traffic
How to Remove 404 Errors in Blogger Blogspot
Why I Make More Pages On My Blog To Increase Organic Traffic
Tidak ada komentar:
Posting Komentar