Add share this floating bar to Blogger

If you want more visitors came to your site so you should have to add share this floating bar to your blog. In this post i am here to show you that how you can add share this and increase your traffic. If you add this floating bar to your blog it will showing on your every post and people can easily share your post via Facebook, Twitter, Pinterest and also on in this floating bar there is +1 Button. I spend too much time to creating buttons and this floating bar.This floating bar have also facility of sharing post via Email address with your friends or anyother.So, here are simple steps you should follow to add Floating bar to your every post.

Step 1:

Go to Blogger and click on Template Tab and Edit Template.

Step 2:

Check the Expand Widget Template Box.

Step 3:

Find the following code (Tip: Press CTRL+F to find code.)

<b:includable id='post' var='post'>

Step 4:

Paste the following code just below the above code.

<b:if cond='data:blog.pageType == &quot;item&quot;'> 

<b:if cond='data:blog.pageType != &quot;static_page&quot;'> 

<style> 

.mbt_social_floating{ 

    position:fixed; bottom:10%; margin-left:-60px; float:left;     width:60px; 

    background-color:#f7f7f7;     padding: 5px 0 0px 0px; 

     border-top:1px solid #ddd; 

border-left:1px solid #ddd; 

border-bottom:1px solid #ddd; 

z-index:9999px !important; 

border-radius:5px;-moz-border-radius:5px;-webkit-border-radius:5px; 

} 

.mbt_social_floating .mbt_side_social_button{ 

    margin-bottom:5px; 

    float:none; 

    height:auto; 

    width:60px; 

} 

.mbt_social_floating .st_twitter_vcount, .mbt_social_floating.st_plusone_vcount, .st_email{ 

    margin-left:5px; 

} 

.mbt_social_floating .st_fblike_vcount{ 

    margin-left:5px; 

} 

.mbt_social_floating .stButton_gradient{ 

    background:none !important; 

    height:21px !important; 

    padding-left:0 !important; 

} 

.mbt_social_floating .chicklets, .mbt_social_floating .stMainServices { 

    background:url(&#39;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEguaS8dZpzJ5Ap8VbHsu_6PZ5-fwHfDSpA65UE5r3Yd2DFBrXbOf2OpYZ3MWbAel3QwTDrA4Ke-0XsfBGKzdaFldSLedSHzfZAWZi3Q01q64wzu6I9YGdMgmypOQaWwck0CIxARxDB30_Jx/s400/gc_social_sprite.gif&#39;) no-repeat !important; 

    height:19px !important; 

    width:45px !important; 

    padding:0 !important; 

} 

.st_email .chicklets{ 

    background-position:0 -77px !important; 

    background-image:url(&#39;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEguaS8dZpzJ5Ap8VbHsu_6PZ5-fwHfDSpA65UE5r3Yd2DFBrXbOf2OpYZ3MWbAel3QwTDrA4Ke-0XsfBGKzdaFldSLedSHzfZAWZi3Q01q64wzu6I9YGdMgmypOQaWwck0CIxARxDB30_Jx/s400/gc_social_sprite.gif&#39;) !important; 

} 

.mbt_social_floating .st_twitter_vcount .st-twitter-counter{ 

    background-position:0 -58px !important; 

} 

.mbt_social_floating  .stButton_gradient{ 

    border:none !important; 

} 

.mbt_social_floating .stBubble_count{ 

    width:44px !important; 

    font-size: 15px !important; 

    font-weight: normal !important; 

    padding-top:7px !important; 

    height:23px !important; 

    background:none !important; 

} 

.mbt_social_floating .st_twitter_vcount .stBubble_count{ 

    color:#00a6df; 

    background-color:#f8fbfc !important; 

} 

.st_fblike_vcount{ 

    margin-bottom: 0px; 

    display: block; 

} 

.st_twitter_vcount{ 

    margin-bottom: 3px; 

    display: block; 

} 

.st_email{ 

    margin-bottom: 5px; margin-top: 3px; 

    display: block; 

} 

.mbt_social_floating .stBubble{ 

    background-position: 21px 31px !important; 

    height:35px !important; 

} 

</style> 

<div class='mbt_social_floating'> 

    <script type='text/javascript'>var switchTo5x=true;</script> 

    <script src='http://w.sharethis.com/button/buttons.js' type='text/javascript'/> 

    <script type='text/javascript'>stLight.options({onhover:false});</script> 

    <span class='st_fblike_vcount' displaytext=''/> 

    <span class='st_twitter_vcount' displaytext='' st_via='The Web Skills'/> 

<div style='margin:5px 0 0px 0;'> 

<center><a class='pin-it-button' count-layout='vertical' expr:href='&quot;http://pinterest.com/pin/create/button/?url=&quot; + data:post.url'>Pin It</a> 

<a href='javascript:void(run_pinmarklet())' style='margin-left:-46px; width:43px; height:20px; display:inline-block;'/> 

<script src='http://assets.pinterest.com/js/pinit.js' type='text/javascript'/> 

<script type='text/javascript'> 

function run_pinmarklet() { 

var e=document.createElement(&#39;script&#39;); 

e.setAttribute(&#39;type&#39;,&#39;text/javascript&#39;); 

e.setAttribute(&#39;charset&#39;,&#39;UTF-8&#39;); 

e.setAttribute(&#39;src&#39;,&#39;http://assets.pinterest.com/js/pinmarklet.js?r=&#39; + Math.random()*99999999); 

document.body.appendChild(e); 

} 

</script> </center> 

</div> 

<div style='margin:0px 0 0 5px;'> 

    <span class='st_plusone_vcount' displaytext=''/> 

</div> 

    

<div class='addthis_toolbox addthis_default_style ' style='margin:5px 0px 5px 8px;'> 

<a class='addthis_counter'/> 

</div> 

<script src='http://s7.addthis.com/js/250/addthis_widget.js' type='text/javascript'/> 

<script type='text/javascript'> 

var addthis_config = { 

     ui_cobrand: &quot;The Web Skills&quot;, 

ui_header_color: &quot;#ffffff&quot;, 

     ui_header_background: &quot;#0080FF&quot; 

} 

</script> 

<span class='st_email' displaytext=''/>  

</div> 

</b:if></b:if>

 After Adding code replace The Web Skills with your twitter username and you have done.

If you find this post helpful so please share this post.

:if>

How to Customize Read More in Blogger

Hi today i will show you how you can change read more text or change read more text to a button mention above. If you want read more buttons instead of text so please first download this Read More Button Pack.

If you want to change text follow this Step 1.

Step 1:

1.Find the following code (Tip: Press CTRL+F to find code.)

<b:if cond='data:post.hasJumpLink'>

You will see the following code :

<b:if cond='data:post.hasJumpLink'>

<div class='jump-link'>

<a expr:href='data:post.url' expr:title='data:post.title'>Read More</a>

</div>

</b:if>

Here change Read More with your own text like Continue Reading etc. Then Save you template and you have done.

If you want to see Read More Button instead of Text follow this Step 2.

Step 2:

1.Find the following code:

<b:if cond='data:post.hasJumpLink'>

When you find this it will look like this:

<b:if cond='data:post.hasJumpLink'>

<div class='jump-link'>

<a expr:href='data:post.url' expr:title='data:post.title'>Read More</a>

</div>

</b:if>

In the Read More text above replace it with this code:

<img src="Your Button Link Here" />

 Replace Your Button Link Here  with your Button link.

Hope you find this post helpful please Share this post and follow our blog.

:if>

ADDING SITEMAP TO GOOGLE WEBMASTER TOOLS

Hi today i am here to show you that how you can add sitemap to Google Webmaster Tools. When you are successfully add sitemap you will get a lot of benefits with this. Google can trace your every new post from your site or a blog and publish it to Search Engine. So, you should need to add sitemap for better SEO blog. So, follow these below simple steps to add sitemap to Google Webmaster Tools.

Step 1:

Just go to Google Webmaster Tools and login using your Gmail account.

Step 2:

Click on your Blog from the dashboard and in the sidbar choose Optimization tab and then Sitemap.

Step 3:

Click on Add Sitemap like this:

After this click you will a light box, paste the following code in the box and click on the Submit Sitemap button you will see.

/atom.xml?redirect=false&start-index=1&max-results=500

Now You have Successfully Added Sitemap to Webmaster Tools.

:if>

Adding a Custom Template to Blogger

Hi There! Today i am here to tell you how can you add a unique and your own template to your blogger.com blogs.It is very simple to add a template to blogger to increase uniqueness of your blog to attract people towards your blog. So, there are very simple step you should follow to change or add a custom template to your blogger.com blogs. Follow these Steps:






1. Download Any Template You like. If you want to get free professional template then just go to that site and download free blogger Templates:

    Deluxe Templates     Blogger Templates      Blogger Styles

2. After Download You will get and .xml Document.
3. Login to your Blogger.com account.
4. Go to Dashboard > Templates > and at the top right you will see Backup/ Restore Click on them.

5. After Click You can see a Box like this below:

   Note: First click on download full template to backup your current or default template.

6. Click on the Choose File as you can see above and chose your .xml sile and then click on upload.

Hurrah  we install  custom template successfully. If you have any problem leave a comment below...

If you like this post plz share it. Thanks!

Related articles

• Prince of Persia -- Warrior Within Full Game Download
• AVG Pc Tuneup 2012 Free Full Version download Mediafire
• Prototype 2 Full Game Download
• 18 Wheels of Steel: Haulin Full Game Download
• Paint.NET Graphic Software Download
• Gimp Graphic software Download

:if>