New Post

Rss

Tuesday, April 30, 2013
Egg Shell Slide Open Bookmarking Widget for blogger

Egg Shell Slide Open Bookmarking Widget for blogger

Every webmaster fights daily to increase web traffic and more subscriptions via social media sites. But attracting visitors/readers is difficult task for webmaster. Maintain quality of content with attractive widget to retain long time on blog a different type or innovative or stylish widget is necessary for blog/websites. In the earlier post we share you “Slide out Open Heart Bookmarking Widget for Blogger”.
Here in this article we share you the same type of “Slide out Widget” in Egg shell, which is stylish, hover, oval shape contains bookmarking button like, Google plus, Twitter, Facebook, Linkedin, Stumble upon, Email subscription, blogger, in single egg shell. Let’s begin the tutorials for adding “Egg shell Bookmarking widget” for blogger.

  How to Add “Slide Out Bookmarking widget in Egg shell”?

 Sign into your blogger account
Click on “Template” link tab (In the new blogger interface)
Tick on “Expand Widget Template” box
Now search for code
</head>

 After finding the code copy the below code and paste above to it
<script src='http://w.sharethis.com/gallery/shareegg/shareegg.js' type='text/javascript'/><script src='http://w.sharethis.com/button/buttons.js' type='text/javascript'/><script type='text/javascript'>stLight.options({publisher: &quot;bea50586-2b9f-448d-947a-01385f28e305&quot;, onhover:false}); </script><link href='http://w.sharethis.com/gallery/shareegg/shareegg.css' media='screen' rel='stylesheet' type='text/css'/>

 After pasting the above code now search for code

</body>

 After finding the code copy the below code and paste above to it

<div style='position: fixed; bottom: 2%; left: 2%;'><div class='shareEgg' id='shareThisShareEgg'/></div><script type='text/javascript'>stlib.shareEgg.createEgg(&#39;shareThisShareEgg&#39;, [&#39;facebook&#39;,&#39;twitter&#39;,&#39;googleplus&#39;,&#39;linkedin&#39;,&#39;blogger&#39;,&#39;stumbleupon&#39;,&#39;sharethis&#39;], {title:&#39; <data:blog.pageTitle/>&#39;,url:&#39;<data:blog.url/>&#39;,theme:&#39;shareegg&#39;});</script><a href="http://www.techmma.com/">Blogger Gadgets</a>

 Now “Save Your Blog Template” and Preview your experiment. You can enjoy and entertain your blog visitors by adding this widget. 

Appreciation

If you enjoyed our tutorial and helped you little bit, help us to Subscribe to our blog.
Posted by at 5:32 PM 0 comments
Labels: ,
How to Add Popup/Floating Ads Widget for blogger

How to Add Popup/Floating Ads Widget for blogger

After getting approval from Content based Advertisers (Pay per click) and driving good traffic, increasing readers but, Revenue of your blog not increasing. Dipping of Revenue if we analyze wrong placement of Ads, Selection of colors for ads display, and sizes etc makes your revenue drop down. There are so many ways to increase your blog revenue with simple bloggertricks and bloggertips. Here, BlogTariff is going to teach you about how to increase your Blog Revenue by adding Floating/Popu widget for blogger to display Ads.
Adsense is number in Content based Ads displaying (Pay per click) program. If Displays Ads in right place then definetly your income would increase gradually. Our tutorial will point you to educate how to create "Floating widget for Ads" on your blog.

 What are the Advantages for adding "Floating widget for Ads"

Readers concetration may dragged towards widget where Ads displayed
Quite attractive widget brings readers to click on Ads
No need work hard for adding this widget
Simple methods makes you to add this widget for your blog
You can increase your blog Revenue by means of this "Floating Ads widget"

 How to add "Floating Widget for Ads"

 Sign into your blogger account
Click on "Design (Layout in the new blogger interface)
Click on "Add a Gadget" widget tab
Select "HTML/Javascript" widget
Now, copy the below code and paste in it
<style>
#btftopbar {
height:30px;
width:auto;
background: #005094 url('..');
background-repeat:repeat-x;
text-align:left;
padding-top:4px;
}
#adsground {
height:600;
margin:0 auto;
width: 160px;
background:#fff;
border-bottom:2px #005094 solid;
border-right:2px #005094 solid;
border-left:2px #005094 solid;
text-align:center;
padding:4px;
}

 #headlineatas {
opacity:1.0;
height:auto;
width:auto;
position:fixed;
top:65px;
left:10px;
border-bottom:1px #005094 solid;
border-bottom:0px blue solid;
color:#333;
padding:0px;
z-index:1001;
font-size:13px;}
</style>
<script type="text/javascript">
function getValue()
{
document.getElementById("headlineatas").style.display = 'none';
}
</script>
<div id="headlineatas">
<div id="btftopbar">
<img align="left" style="padding-right:2px;" src="#" />
<span style="color:#fff;font-size:13px;font-weight:bold;text-shadow:black 0.1em 0.1em 0.1em">Click to Close</span>
<span style="color:#fff;font-size:13px;font-weight:bold;text-shadow:black 0.1em 0.1em 0.1em;float:right;padding-top:3px;padding-right:10px"><a href="http://www.bidvertiser.com/bdv/bidvertiser/bdv_ref.dbm?Affiliate_ID=25&Ref_Option=pub&Ref_PID=493381" target="_blank" onclick="getValue()">close</a></span>
</div>
<div id="adsground">
<h3>Sponsor Ads </h3>
<p align="left"><h3></h3></p>
<p>
"Ads code Here"
<br/></p></div></div>

Customization 

 Replace "Ads code Here" with your Adsense script code and 
If you want display 120x600 ads adjust "160px" to 120 
 By default Ads will be displayed at left sidebar, if you want to display ad on Right side then change "left:" with "Right". 
After all successful necessary modifications "Save your Widget" and "Save the blog Template". Now its time to preview your experiment. 

 Appreciation: 

If you enjoyed our tutorial and helped you little bit, help us to Subscribe to our blog.
Posted by at 5:10 PM 8 comments
Labels: ,
Subscribe to: Posts (Atom)
Copyright © 2012 Blogger Tips and Tricks All Right Reserved
Designed by Tech MMA And Premium Blogger template
Posts RSS
Comments RSS