add Sticky horizontal Bar With Share Buttons for Blogger


Sticky Bar With Share Buttons for Blogger
Hi! Everyone, A sticky bar is a fixed bar which is visible at the top of the header or at the footer. This sticky bar looks similar to the "Hello Bar" for WordPress blogs. A sticky bar is widely used by all blogs today and hence I’ve created this sticky bar embedded with share buttons for Blogger with which visitors can easily share posts directly from the bar.


----------------------------------------------------------------


---------------------------------------------------------------



  1. Login to your Blogger Dashboard > Design >Edit HTML
  2. Take a backup of your template before you proceed.
  3. Go to your Blogger Dashboard > Layout > Add a Gadget > HTML/JavaScript and paste the following code in the editor. 
    <style type='text/css'>
    #tnsbar {
    background: none repeat scroll 0 0 #AC0101;
    border-bottom: 2px solid #F3F3F3;
    box-shadow: 0 2px 7px #000000;
    color: #FFFFFF;
    font-size: 10px;
    height: 30px;
    margin: 0;
    overflow: hidden;
    padding: 0;
    position: fixed;
    right: 0;
    top: 0;
    width: 100%;
    z-index: 100;
    }
    #tnsbar a {
    color: #FFFFFF;
    font-family: 'Droid Sans',sans-serif;
    font-size: 12px;
    font-weight: bold;
    line-height: 30px;
    list-style: none outside none;
    text-decoration: none;
    margin:50px;
    }
    </style>

    <div id="tnsbar">
    <div style="float:right;padding:4px;">
    <a href='http://twitter.com/share' class='twitter-share-button' expr:data-url='data:post.url' expr:data-text='data:post.title' data-via='technetsavvy' data-lang='en'></a>
    <b:if cond='data:post.isfirstpost'>f
    </b:if>
    </div>

    <div style="float:right;padding:4px;">
    <g:plusone size="medium"></g:plusone>
    </div>

    <div style="float:right;padding:4px;">
    <fb:like layout="button_count" show_faces="false" font=""></fb:like>
    </div>

    <p><a href='#' target='_blank'>Your Text Here</a></p>
    </div>
  4. Now add the following JavaScript's above the </body> tag to your template only if you haven’t added the Like, Tweet and Google+ button to your blog. If you have already done so, you don’t need to add these JavaScript's. 
    <script src='http://connect.facebook.net/en_US/all.js#xfbml=1'/>

    <script src='https://apis.google.com/js/plusone.js' type='text/javascript'/>


    <script src='//platform.twitter.com/widgets.js' type='text/javascript'/>
  5. You can easily change the background color of the sticky bar by replacing #AC0101  with your preferred color.
  6. To change the text replace Your Text Here with your desired text/featured post/announcement etc. and replace # with the link it corresponds to.
  7. Replace technetsavvy with your twitter handle.


--------------------------------------------------------


i recomment you that not try tricks on the blogger posts blody html codes
coz they may sometimes become slow down your blog
dont use any third party servers morethan 2 between the posts

no forther causes
enjoy
dont worry about anything. BUT just check out google rules and regulations
I had checked out these stuffs.and i realise that if you work hard on your blog posts you will get what you are aiming.(am sure)
you can also check out blogger stuffs in this blog to make blog more cozy


to do as google guys says
Always make your readers cheer. other than suffering them with ads.
i also recomment to give readers miximised freedom


Facebook has recently added the ability for its users to "Like" just about any content on the web and have that activity posted to the users' walls. This facility lets you share content more readily and also gives you an idea of how some of your readership traffic is responding to your content.
This article provides step-by-step instructions on how to add the "Like" button to your Blogger (BlogSpot) blog, one of the more commonly used blogging services.

-----------------------------------------------------------------------





SHOOT A COMMENT,

Latest posts.