Showing posts with label Tweeter. Show all posts
Showing posts with label Tweeter. Show all posts

Add a Floating Social Media Counter Button Including Pinterest Pin it Button

3 comments
Today I am bit free and Holidays it is I have decided to lets play with CSS again.  I am going to put a floating Bar Widget  For Blogger and WordPress both . Contain Facebook like button and Twitter Counter  By tweetmeme and Pinterest Pin it button and Google G+ button as we know Facebook and Tweeter are widely known social media without which you can not call blog a blog. This widgets lets your reader circulate and share the post to their best and loving ones.

"This new version of CD Widgets are available all this four social media buttons if you want to add more buttons to it and need help from us feel free to ask and drop your doubt in Comment box."

This can be further edited :
  • This can be aligned any where in the blog left or right side of your website. By default it will appear in the middle left of your blog.
  • You can add more more Social media to it like Digg.
Follow the Steps to Add Facebook, Twitter, Pinterest and Google G+ Counter to Blogger:
  • Log in to blogger>Design.
  • Select HTML/JavaScript Widgets from anywhere (position Doesn't matter).
  • Inside it Post the code Below.
<style>
/*-------CD Sharing Widget------------*/
#cdfloat {
  position:fixed;
bottom:15%;
margin-left: -84px;
z-index:10;
float:left;
padding-bottom:2px;
}
#cdsidebar {
        background:#fff;
        border-top:1px solid #ddd;
        border-left:1px solid #ddd;
        border-bottom:1px solid #ddd;
        border-radius:5px;
       -moz-border-radius:5px;
       -webkit-border-radius:5px;
        padding-left:5px;
        width:60px;
        margin:0 0 0 5px;
}
.fb_share_count_top {width:52px !important;}
.fb_share_count_top, .fb_share_count_inner {-moz-border-radius:3px;-webkit-border-radius:3px;}
.FBConnectButton_Small, .FBConnectButton_RTL_Small {width:52px !important; -moz-border-radius:3px;/*bs-fsmsb*/-webkit-border-radius:3px;}
.FBConnectButton_Small .FBConnectButton_Text {padding:2px 2px 3px !important;-moz-border-radius:3px;-webkit-border-radius:3px;font-size:8px;}
</style>
<div id="cdfloat">
<div id="cdsidebar">
    <table cellpadding="1px" cellspacing="0">
<tr>
    <td style="padding:5px 0px 0px 0;">
<a href="http://twitter.com/share" class="twitter-share-button" data-count="vertical" data-via="probloggingtool">Tweet</a><script type="text/javascript" src="http://platform.twitter.com/widgets.js"></script>
    </td>
    </tr>
    <tr>
    <td style="padding:5px 0 2px 0;">
    <a name="fb_share" type="box_count" href="http://www.facebook.com/sharer.php">Share</a><script src="http://static.ak.fbcdn.net/connect.php/js/FB.Share" type="text/javascript"></script>
    </td>
    </tr>
    <tr>
    <td style="padding:5px 0 2px 0;">
    <a href="http://pinterest.com/pin/create/button/" class="pin-it-button" count-layout="vertical"><img border="0" src="//assets.pinterest.com/images/PinExt.png" title="Pin It" /></a>
    </td>
    </tr>
    <tr>
    <td style=" padding:5px 0px 0px 0px;">
<script src='http://apis.google.com/js/plusone.js' type='text/javascript'> {lang: &#39;en-US&#39;} </script>
<g:plusone size="Tall" expr:href="data:post.url">
    </g:plusone></td>
    </tr>
    <tr>
    <td> <a href="http://coderdesire.blogspot.in/2012/06/add-floating-social-media-counter.html" style="color:#000000; font-size:8px">Get This </a>
    </td>
    </tr>
        </table> </div> </div>
  • Save your widgets and you are Done !
See your Blog its look beautiful with a hanging light widgets in middle left of your Website. hope you liked it...  :)

Read More...

How to Add The Animated Eassy Bookmarking Gadget To Your Blog

Leave a Comment
All is that All blogger , reader like the Social media Button very Much.And widgets especially unique gadgets that can catch the eye of readers and get them bookmarking your blog.Today I have a very cool social bookmarking gadget with a stylish animated effect.With the Sassy bookmarks gadget a basic share button is placed in the corner of your blog, then on hover 6 icons for the main social bookmarking websites appear in a semicircle.The buttons that appear are for Pinterest, Google+, Facebook, Twitter, Tumblr and Email.

Add The Animated Sassy Bookmarking Gadget To Your Blog :

Remember Always Back Up Your Template Before You Make Changes - How To Back Up A Blogger Template.

Step 1: In Your Blogger Dashboard Click The Drop Down Menu For Your Blog > Choose Template > Then Edit Html > Tick The Expand Widget Templates Box.

Step 2: Find the following piece of code in your blogs Html : (Click Ctrl and F for a search bar to help find the code.
 
</body>

Step 3: Copy and Paste the following code Directly Above / Before </body>


<!-- Start Shareaholic Sassy Bookmarks HTML - http://www.coderdesire.blogspot.com -->
<div class='shr_ss shr_publisher'>


</div>
<!-- End Shareaholic Sassy Bookmarks HTML -->
<!-- Start Shareaholic Sassy Bookmarks settings -->
<script type='text/javascript'>
var SHRSS_Settings = {&quot;shr_ss&quot;:{&quot;src&quot;:&quot;//dtym7iokkjlif.cloudfront.net/media/downloads/sassybookmark&quot;,&quot;link&quot;:&quot;&quot;,&quot;service&quot;:&quot;5,7,2,313,38,201,88,74&quot;,&quot;apikey&quot;:&quot;b87f5899d80a5edce8b5e55f58542ef0f&quot;,&quot;localize&quot;:true,&quot;shortener&quot;:&quot;bitly&quot;,&quot;shortener_key&quot;:&quot;&quot;,&quot;designer_toolTips&quot;:true,&quot;tip_bg_color&quot;:&quot;black&quot;,&quot;tip_text_color&quot;:&quot;white&quot;,&quot;viewport&quot;:true,&quot;twitter_template&quot;:&quot;${title} - ${short_link} via @Shareaholic&quot;}};
</script>
<!-- End Shareaholic Sassy Bookmarks settings -->
<!-- Start Shareaholic Sassy Bookmarks script -->
<script type='text/javascript'>
(function() {
var sb = document.createElement(&quot;script&quot;); sb.type = &quot;text/javascript&quot;;sb.async = true;
sb.src = (&quot;https:&quot; == document.location.protocol ? &quot;https://dtym7iokkjlif.cloudfront.net&quot; : &quot;http://cdn.shareaholic.com&quot;) + &quot;/media/js/jquery.shareaholic-publishers-ss.min.js&quot;;
var s = document.getElementsByTagName(&quot;script&quot;)[0]; s.parentNode.insertBefore(sb, s);
})();
</script>


<!-- End Shareaholic Sassy Bookmarks script -->
<!-- End Shareaholic Sassy Bookmarks HTML - http://www.coderdesire.blogspot.com -->
Step 4: Save Your Template.

You are Done !

That's it the animated Sassy Bookmarks gadget is on your blog !

Enjoy & Drop Your Comments And Questions Below !

Read More...

Install Twitter Application for Google+

Leave a Comment
To Add Twitter to Google follow the simple steps Given below:
1. Click Here to  Install the Twitter App.
                          or

2.Once installed, restart your browser and log into your Google Plus account.
3.At the top you will see a twitter button. Click it and click the Sign in button so that you could permit the application to access your twitter feed.
4.Once you allow the access you can then revisit your account to post, read and receive tweets live as shown below

That's all you have Done !                                 
Read More...

Now Add Twitter to Google +

1 comment
Now you can easily available to your Twitter friends from your Google + account too. you need not to log into both account. Now you can easily read your Twitter friends Tweets on your Google + Dashboard. This Linkup you can do with your Google + and Twitter account by using the App for that . This Apps are working on the Browsers Like IE, Mozilla and Chrome. So if you are the daily user of any of the Browser you can enjoy it. Once you install this application a small twitter button will appear next to your home and photos button at your Google+ dashboard. On clicking the twitter button you can then read your real-time tweets. Not just that you can post tweets, see what's hot on twitter, check inbox and a lot more. You will have complete control over your twitter account.


Now the Question is How it Can Happen/ You can Apply this to your Google + Dashboard .

Read the post below..


Read More...

Add Recommended For You Slide out Wordpress Style Widget to Blogger.


In this post i will tell you how you can engage your reader on your sight . By simply adding new Widgets to your Website.Its an Wordpress Style Widgets you can simply add to your Website. This one you can easily Add to your Website.
How it works is make a random Select a Topic from your site post and recommend it to your reader.

Have a look to a live demo.

Follow the Following steps to Add Recommend For You Widget to you Blogger Website :
  1. Go to Simple Reach.
  2. Create an account, make sure to check your Email for Confirmation link.
  3. Choose Blogger as your Platform and Follow the steps to Download your Blogger Template and Upload it to Simple Reach.
  4. Save the Updated Template From Simple Reach.
  5. Now Upload that Updated Template to your blogger.
  6. You are Done ! wait for few hour and the Slide will appear on your Blog.
Hope you liked it. Feel free to ask if you have any confusion ..  :)
Read More...

Add a floating Social Media Counter To your Website

Leave a Comment
Today I am bit free and Holidays it is I have decided to lets play with CSS again.  I am going to put a floating Bar Widget  For Blogger and WordPress both . Contain Facebook like button and Tweeter Counter  By tweetmeme and Stumble Upon as we know Facebook and Tweeter are widely known social media without which you can not call blog a blog. This widgets lets your reader circulate and share the post to their best and loving ones.
This can be further edited :
  • this can be aligned any where in the blog left or right side of your website. By default it will appear in the middle left of your blog.
  • You can add more more Social media to it like Digg.

Do see the demo first.
Follow the Steps to Add Facebook, Tweeter and Stumble Upon Counter to Blogger:
  1. Log in to blogger>Design.
  2. Select HTML/JavaScript Widgets from anywhere (position Doesn't matter).
  3. Inside it Post the code Below.


<div style="display:scroll; position:fixed; top:40%; left:2%; border: 1px dotted #E8E8E8; padding:0px 0px 0px  5px; height:220px; width:53px "> 
    <table cellpadding="1px" cellspacing="0"> 
    <tr> 
    <td style="border-bottom: 1px solid #E8E8E8; padding:5px 0 2px 0;">  
    <div id='fb-root'/><script src='http://connect.facebook.net/en_US/all.js#xfbml=1'/><fb:like font='' href='' layout='box_count' send='false' show_faces='false'/> 
    </td> 
    </tr>
    <tr> 
    <td style="border-bottom: 1px solid #E8E8E8; padding:5px 0px;"> 
    <script src="http://www.stumbleupon.com/hostedbadge.php?s=5"></script> 
    </td> 
    </tr>
    <tr> 
    <td style="border-bottom: 0px solid #E8E8E8; padding:5px 0 0px 0;">
<a href="http://twitter.com/share" class="twitter-share-button" data-count="vertical" data-via="CoDer..Desire..!!!">Tweet</a><script type="text/javascript" src="http://platform.twitter.com/widgets.js"></script> 
    </td> 
    </tr>
    </table> 
    </div>

4. Replace CoDer..Desire..!!! with your tweeter user name,
5. Save your widgets and you are Done !
See your Blog its look beautiful with a hanging light widgets in middle left of your Website. hope you liked it...  :)
Read More...