BuZZa Uz

Mar 30, 2011

Create Social Networking Sharing Button Float besides Blogger

Posted by Rino Widjaya

Now this I will post about How to Create Social Networking Sharing Button Float besides Blogger.
Maybe in between you still many who do not know and even vice versa.
Well, I just give the solution for you, you just follow the steps below:

Step - Step:
  • Login to Blogger
  • Click Design
  • Click Edit HTML
  • Find code ]]></ b: skin> Copy and Paste the code below just above the code is "]]></ b: skin>"
 #sharehal {position:fixed; bottom:20%; margin-left:185px; float:left; border-radius:5px;-moz-border-radius:5px;-webkit-border-radius:5px;background-color:#fff;padding:0 0 2px 0;z-index:10;}
#sharehal .tblshare {float:left;clear:both;margin:5px 5px 0 5px;}
.fb_share_count_top {width:48px !important;}
.fb_share_count_top, .fb_share_count_inner {-moz-border-radius:3px;-webkit-border-radius:3px;}
.FBConnectButton_Small, .FBConnectButton_RTL_Small {width:49px !important; -moz-border-radius:3px;-webkit-border-radius:3px;}
.FBConnectButton_Small .FBConnectButton_Text {padding:2px 2px 3px !important;-moz-border-radius:3px;-webkit-border-radius:3px;font-size:8px;}
.sharesoc {display:inline-block;float:right;height:125px;margin:5px 0;width:60px;}

Description:
To adjust the position of the button on the second way (Floating Share button on the Edge of article) note the code in Step 4 line 1:

  1. Bottom: 20% = 20% change the value to set the distance between the bottom of the browser with a button
  2. margin-left: 185px = change the value 185 to adjust the distance between the edge of the browser with a button
  3. float: left = change left to right if we want to put the button on the right page article
  4. background-color: # fff = fff change the value to set the background color and adjust the background color of your blog posts
  • Next you find the code </ body> and paste the code below just above the code </ body>
 <div id='sharehal'>
<div class='tblshare' id='fb'>
<a href='http://www.facebook.com/sharer.php' name='fb_share' type='box_count'>Share</a><script src='http://static.ak.fbcdn.net/connect.php/js/FB.Share' type='text/javascript'/>
</div>
<div class='tblshare' id='rt'>
<script src='http://tweetmeme.com/i/scripts/button.js' type='text/javascript'/>
</div>
<div class='tblshare' id='su'>
<script src='http://www.stumbleupon.com/hostedbadge.php?s=5'/>
</div>
<div class='tblshare' id='digg'>
<script src='http://widgets.digg.com/buttons.js' type='text/javascript'/>
<a class='DiggThitblshare DiggMedium'/>
</div>
<div class='tblshare' id='gb'>
<a class='google-buzz-button' data-button-style='normal-count' href='http://www.google.com/buzz/post' title='post on google buzz'>
<script src='http://www.google.com/buzz/api/button.js' type='text/javascript'/>
</a>
</div>
</div>
  • Save Template.
  • Finish
Now look at your work and do not forget that this also read Software and How to Reset Epson Stylus T13

0 comment:

Post a Comment

Popular Posts

Translate

Like Box BuZZa Uz

Email Subscriptions

Enter your email address:

Delivered by FeedBurner

Site Info

Ping your blog, website, or RSS feed for Free Google Pagerank Powered by  MyPagerank.Net

Yahoo bot last visit powered by MyPagerank.Net Msn bot last visit powered by MyPagerank.Net Free Automatic Backlink

Site Visitor

Flag Visitor

free counters

Followers

Site Info

Text Back Link Exchange

Florists Links AllNewsSite Link Exchange

Text Back Links Exchanges

 

Copyright © 2011 BuZZa UZ | Blogger Template Design By Simrandeep Singh

Share