Browse » » » Shareholic - New Sharing Widget for blogger blogs 2012

Shareholic - New Sharing Widget for blogger blogs 2012

| Tags : Blogger Widgets, Blogging

Founded in 2008, Shareaholic is the leader in making content sharing & discovery on the web faster and easier while also making it simple for web publishers, advertisers and mainstream businesses to measure the effectiveness of their content.

With more than 2 million browser plugin installations for Chrome, Firefox, Safari and more and its growing publisher network of over 200,000 websites using Shareaholic’s content sharing tools which are available for any website including WordPress and Tumblr,
Shareaholic reaches more than 270 million unique monthly visitors and has permission to an unparalleled amount of aggregate social data and reach to create targetable audiences for advertisers.

This service actually provides 3 types of sharing widgets where I will share here all the the 3, they name the widgets with:
1.Classic
2.Sexy
3.Sassy

i. Classic

    Simple style works on any layout
    Small size means they load FAST!
    Can be placed almost anywhere on your page
    Available for all own hosted websites and also for blogs hosted at blogger, wordpress, tumblr, drupal.
    
For this use the below given HTML (only for blogger blogs)

<!-- Start Shareaholic Classic Bookmarks settings -->
<script type="text/javascript">
  var SHRCB_Settings = {"shr_classic":{"size":"32","link":"","service":"5,7,313,309,78,304,88","apikey":"2fc518bd8c0bb3cf45bdade11877971c1","shortener":"bitly","shortener_key":"","designer_toolTips":true,"twitter_template":"${title} - ${short_link} via @Shareaholic"}};
  var SHRCB_Globals = {"perfoption":"1"};
  </script>
 <!-- End Shareaholic Classic Bookmarks settings -->

        <!-- Start Shareaholic Classic Bookmarks script -->
<script type="text/javascript">
       (function() {
            var sb = document.createElement("script"); sb.type = "text/javascript";sb.async = true;
            sb.src = ("https:" == document.location.protocol ? "https://dtym7iokkjlif.cloudfront.net" : "http://cdn.shareaholic.com") + "/media/js/jquery.shareaholic-publishers-cb.min.js";
            var s = document.getElementsByTagName("script")[0]; s.parentNode.insertBefore(sb, s);
        })();
        </script>

<!-- End Shareaholic Classic Bookmarks script -->

        <script type='text/javascript'>
          if (typeof(SHR4P)=="undefined") SHR4P = {};
          SHR4P.blogger_addDiv = SHR4P.blogger_addDiv || function(divClass)
          {
                  var post = new RegExp('hentry');
                  var titleContainer = new RegExp('post-title');
                  var postContainer = new RegExp('post-footer');
                  var elements = document.getElementsByTagName('div');
                  for (var i = 0; i < elements.length; i++)
                  {
                      var classes = elements[i].className;
                      if (post.test(classes))
                      {
                          var container = elements[i];
                          for (var j = 0; j < container.childNodes.length; j++)
                          {
                              var item = container.childNodes[j].className;
                              if (titleContainer.test(item))
                              {
                                  var link = container.childNodes[j].getElementsByTagName('a');
                                  if (typeof(link[0]) != "undefined")
                                  {
                                      var url = link[0].href;
                                      var title = link[0].innerHTML;
                                  }
                                  else
                                  {
                                      var url = document.url;
                                      var title =  container.childNodes[j].innerHTML;
                                  }
                                  if (typeof(url) == "undefined"|| url == 'undefined' ){
                                      url = window.location.href;
                                  }
                                  title=title.replace('"',"%22");
                              }
       
                              if (postContainer.test(item))
                              {
                                  var footer = container.childNodes[j];
                              }
                          }
                          var d = document.createElement('div');
                          var code = '<div style="clear:both"></div><div class="' + divClass + ' shareaholic-show-on-load" data-shr_href="' + encodeURI(url) + '" data-shr_title="' + title + '"></div><div style="clear:both"></div>';

                          d.innerHTML = code;
                          container.insertBefore(d , footer);
                    }
                }
                return true;
        };
        SHR4P.blogger_addDiv("shr_classic");</script>


ii. Sexy
    Looks great on mobile devices
    They’re animated, Mouseover them ;)
    Small size means they load FAST!



<!-- Start Shareaholic Sexy Bookmark settings -->
<script type="text/javascript">
  var SHRSB_Settings = {"shr_class":{"src":"//dtym7iokkjlif.cloudfront.net/media/downloads/sexybookmarks_tumblr","link":"","service":"5,7,2,313,38,88,74","apikey":"0747414f47c2b684cf5480c36b2478689","localize":true,"shortener":"bitly","shortener_key":"","designer_toolTips":true,"tip_bg_color":"black","tip_text_color":"white","twitter_template":"${title} - ${short_link} via @Shareaholic"}};
  var SHRSB_Globals = {"perfoption":"1"};
  </script>
 <!-- End Shareaholic Sexy Bookmark settings -->

        <!-- Start Shareaholic Sexy Bookmark script -->
<script type="text/javascript">
       (function() {
            var sb = document.createElement("script"); sb.type = "text/javascript";sb.async = true;
            sb.src = ("https:" == document.location.protocol ? "https://dtym7iokkjlif.cloudfront.net" : "http://cdn.shareaholic.com") + "/media/js/jquery.shareaholic-publishers-sb.min.js";
            var s = document.getElementsByTagName("script")[0]; s.parentNode.insertBefore(sb, s);
        })();
        </script>

<!-- End Shareaholic Sexy Bookmark script -->

        <script type='text/javascript'>
          if (typeof(SHR4P)=="undefined") SHR4P = {};
          SHR4P.blogger_addDiv = SHR4P.blogger_addDiv || function(divClass)
          {
                  var post = new RegExp('hentry');
                  var titleContainer = new RegExp('post-title');
                  var postContainer = new RegExp('post-footer');
                  var elements = document.getElementsByTagName('div');
                  for (var i = 0; i < elements.length; i++)
                  {
                      var classes = elements[i].className;
                      if (post.test(classes))
                      {
                          var container = elements[i];
                          for (var j = 0; j < container.childNodes.length; j++)
                          {
                              var item = container.childNodes[j].className;
                              if (titleContainer.test(item))
                              {
                                  var link = container.childNodes[j].getElementsByTagName('a');
                                  if (typeof(link[0]) != "undefined")
                                  {
                                      var url = link[0].href;
                                      var title = link[0].innerHTML;
                                  }
                                  else
                                  {
                                      var url = document.url;
                                      var title =  container.childNodes[j].innerHTML;
                                  }
                                  if (typeof(url) == "undefined"|| url == 'undefined' ){
                                      url = window.location.href;
                                  }
                                  title=title.replace('"',"%22");
                              }
       
                              if (postContainer.test(item))
                              {
                                  var footer = container.childNodes[j];
                              }
                          }
                          var d = document.createElement('div');
                          var code = '<div class="' + divClass + ' shareaholic-show-on-load" data-shr_href="' + encodeURI(url) + '" data-shr_title="' + title + '"></div>';

                          d.innerHTML = code;
                          container.insertBefore(d , footer);
                    }
                }
                return true;
        };
        SHR4P.blogger_addDiv("shr_class");</script>


iii. Sassy
    Looks great on mobile devices
    They’re animated
    Small size means they load FAST!
    Available for all own hosted and other blogs hosted at famous blogging platforms.

Use the below given code for this sassy sharing widget.


            <!-- Start Shareaholic Sassy Bookmarks HTML-->
<div class="shr_ss shr_publisher">

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

<!-- End Shareaholic Sassy Bookmarks script -->

     

Hope you liked this post, please comment and subscribe to us.


Enjoyed the article?
Subscribe to this Blog via Email:

Click here to subscribe to FREE email updates from "Everything About Blogging", so that you do not miss out anything that can be valuable to you and your blog!

    Other Recommended Posts

  • Blogger Widgets, Blogging

Use the tab below to comment. No spam please!!!

POST YOUR COMMENT

Subscribe to: Post Comments (Atom)
[netinsert=0.0.1.11.14.1]