• Tutorials
  • Blogger Themes
  • Blogger SEO
  • Blogger Widgets
  • Internet
  • Mobile Phones
  • Gadgets
BloggerHero - Blogger Tuts, SEO, Themes, Gadgets
  • Home
  • Blogger
  • SEO
  • Themes
  • Internet
  • Widgets
  • Gadgets
  • About
  • search
    close

Cute Social Bookmarking Widget for Blogger

 Rohitkumar  06:13  7 comments
Tweet
Cute Social Bookmarking Widget for Blogger
Social Share Widgets are always been most important part of every blogger's blog. You must have atleast one social share widget on your blog to make your blog perfect. After spending couple of hours, finally I made this "Cute" widget for blogger blog. As we know social bookmarking tools / widgets are most important for any website / blog for building social media backlinks by which your blogger rank increases rapidly.
I have shared many Social Bookmarking or Social Sharing Widgets for Blogger but this one is totally outstanding as it is combined with CSS codes with premium thumbnails by DesignBolts. I hope you would like to install  this widget on your blog.

What's Special in This Widget?

1. Easy Installation.
2. Totally Customized with CSS Codes.
3. Fast Loading, doesn't affect blog page loading time.
4. User Friendly.
5. Smooth Hovering Experience.
You can check out the live demo of this widget. Click below button for Live Demo of this widget.

Live Demo

Do you like it? Well, its too easy to install this awesome cute social share widget in your blogger template. As I have already said, this widget is totally improved with css codes and have highly smoothened for best sharing experience. Want to try? Just follow these easy steps.

How To Install Cute Social Bookmarking Widget for Blogger?

1. Go to Blogger > Dashboard > Template.
2. Click Edit HTML.
3. Then find this code ]]></b:skin> by pressing CTRL+F
4. After finding the code ]]></b:skin> paste the following code just above it.
ul.abt-social { list-style:none; margin:15px auto;display:inline-block; }
ul.abt-social li { display:inline; float:left; background-repeat:no-repeat; }
ul.abt-social li a { display:block; width:48px; height:48px; padding-right:10px; position:relative; text-decoration:none; }
ul.abt-social li a strong { font-weight:normal; position:absolute; left:20px; top:-1px; color:#fff; padding:3px; z-index:9999; text-shadow:1px 1px 0 rgba(0, 0, 0, 0.75); background-color:rgba(0, 0, 0, 0.7); -moz-border-radius:3px; -moz-box-shadow: 0 0 5px rgba(0, 0, 0, 0.5); -webkit-border-radius:3px; -webkit-box-shadow: 0 0 5px rgba(0, 0, 0, 0.5); border-radius:3px; box-shadow: 0 0 5px rgba(0, 0, 0, 0.5);}
ul.abt-social li.abt-facebook { background-image:url("http://picoolio.net/images/2013/09/16/Facebook.png"); }
ul.abt-social li.abt-twitter { background-image:url("http://picoolio.net/images/2013/09/16/Twitter.png"); }
ul.abt-social li.abt-googlebuzz { background-image:url("http://picoolio.net/images/2013/09/16/Google-Plus.png"); }
ul.abt-social li.abt-stumbleupon { background-image:url("http://picoolio.net/images/2013/09/16/Stumble-Upon.png"); }
ul.abt-social li.abt-digg { background-image:url("http://picoolio.net/images/2013/09/16/Digg.png"); }
ul.abt-social li.abt-delicious { background-image:url("http://picoolio.net/images/2013/09/16/Delicious.png"); }
ul.abt-social li.abt-linkedin { background-image:url("http://picoolio.net/images/2013/09/16/Linkedin.png"); }
ul.abt-social li.abt-reddit { background-image:url("http://picoolio.net/images/2013/09/16/Reddit.png"); }
ul.abt-social li.abt-technorati { background-image:url("http://picoolio.net/images/2013/09/16/Technorati.png"); }
#abt-cssanime:hover li { opacity:0.2; }
#abt-cssanime li { -webkit-transition-property: opacity; -webkit-transition-duration: 500ms;-moz-transition-property: opacity; -moz-transition-duration: 500ms; }
#abt-cssanime li a strong { opacity:0; -webkit-transition-property: opacity, top; -webkit-transition-duration: 300ms; -moz-transition-property: opacity, top; -moz-transition-duration: 300ms; }
#abt-cssanime li:hover { opacity:1; }
#abt-cssanime li:hover a strong { opacity:1; top:-10px; }
5. Now find the code <data:post.body/> by pressing CTRL+F
6. After Finding the code <data:post.body/> paste the following code just below it.
<b:if cond='data:blog.pageType == "item"'>
<div style="text-align: center;">
<span style="color: black; font-family: Trebuchet MS; font-size: 14px;"><b>If You Enjoyed This Take 5 Second to Share it.</b></span>
<a href="http://techethix.blogspot.com/" rel="dofollow"></a>
<ul class='abt-social' id='abt-cssanime'>
<li class='abt-facebook'>
<a expr:href='&quot;http://www.facebook.com/sharer.php?u=&quot; + data:post.url + &quot;&amp;t=&quot; + data:post.title' rel='external nofollow' target='_blank'><strong>Facebook</strong></a>
</li>
<li class='abt-twitter'>
<a expr:href='&quot;http://twitter.com/home?status=&quot; + data:post.title + &quot; -- &quot; + data:post.url ' rel='nofollow' target='_blank'><strong>Twitter</strong></a>
</li>
<li class='abt-googlebuzz'>
<a expr:href='&quot;https://plus.google.com/share?url=&quot; + data:post.url + &quot;&amp;imageurl=&quot;' rel='nofollow' target='_blank'><strong>Google+</strong></a>
</li>
<li class='abt-stumbleupon'>
<a expr:href='&quot;http://www.stumbleupon.com/submit?url=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title ' rel='nofollow' target='_blank'><strong>StumbleUpon</strong></a>
</li>
<li class='abt-digg'>
<a expr:href='&quot;http://digg.com/submit?phase=2&amp;url=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title ' rel='nofollow' target='_blank'><strong>Digg</strong></a>
</li>
<li class='abt-delicious'>
<a expr:href='&quot;http://delicious.com/post?url=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title ' rel='nofollow' target='_blank'><strong>Delicious</strong></a>
</li>
<li class='abt-linkedin'>
<a expr:href='&quot;http://www.linkedin.com/shareArticle?mini=true&amp;url=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title + &quot;&amp;summary=&amp;source=&quot;' rel='nofollow' target='_blank'><strong>LinkedIn</strong></a>
</li>
<li class='abt-reddit'>
<a expr:href='&quot;http://reddit.com/submit?url=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title ' rel='nofollow' target='_blank'><strong>Reddit</strong></a>
</li>
<li class='abt-technorati'>
<a expr:href='&quot;http://technorati.com/faves?add=&quot; + data:post.url ' rel='nofollow' target='_blank'><strong>Technorati</strong></a>
</li>
</ul>
<br />
<div style="text-align: right;">
<span style="font-family: Times, Times New Roman, serif; font-size: 10px;"><a href="http://gg.gg/cshwfb" rel="dofollow" target="_blank" title="Get This WIdget">Get</a></span></div></div>
</b:if>
7. That's it ! You are done. now go to your blog and check it ! I hope you must have liked and willing to install this widget on your blogger blog.
Note : This widget is totally made by Us [TechEthix Property] Kindly don't remove the attribution link from this widget. If you removed it there could be copyright avoilation complaint against you. So don't edit anything in above widget.
Your comments are always appreciated and If you have any problem regarding this widget please let us know or simply drop them here. Stay Connected.

    Sharing is Caring!

  • Facebook
  • Twitter
  • Google+
  • StumbleUpon
  • linkedIn
  • StumbleUpon

Rohitkumar A

Posted In blogger, css, Social Share Widgets, tool, trick
Subscribe Now

Get Latest Posts Directly Into You Inbox

 7 comments :

  1. Techex16 September 2013 at 21:21

    This Widget is really cool thanks for providing us.
    this is also help to increase social traffic when ever someone share content on their wall.
    thanks for sharing this kind of widget.

    ReplyDelete
    Replies
    1. Rohitkumar A17 September 2013 at 06:30

      Thanks for being here Rizwan Saharan, I am so glad that you liked it.
      I hope you must have tried it on your blog. Stay Connected :)

      Delete
      Replies
        Reply
    2. Reply
  2. Kim B. Padilla29 September 2013 at 23:12

    Creative widget ,Thanks for sharing the details.I had found out some other tools which can help you for social media promotions like Viral Content Buzz,Facebook Image Detection Tool by TechWyse,BuzzBundle.I had read the details at Moz Blog.

    ReplyDelete
    Replies
    1. Rohitkumar A30 September 2013 at 03:20

      Thanks for sharing your thoughts here Kim B. Padilla,
      I hope you would like to take tour on my blog :-)
      Stay Connected ;-)

      Delete
      Replies
        Reply
    2. Reply
  3. Anonymous30 September 2013 at 23:24

    Thanks for sharing fabulous information. It' s my pleasure to read it.I have also bookmarked you for checking out new posts. by PSY 201 Week 8 Assignment

    ReplyDelete
    Replies
    1. Rohitkumar A1 October 2013 at 02:57

      Thanks Buddy, You can get here Awesome Tricks and Widgets for Blogger :)
      Stay connected and thanks for bookmarking :)

      Delete
      Replies
        Reply
    2. Reply
  4. Anonymous18 January 2015 at 00:51

    Its working fine...thanku :)

    ReplyDelete
    Replies
      Reply
Add comment
Load more...

Newer Post Older Post Home
Do you like my work?

Buy Me a Coffee!

Popular Posts

  • MaterialMix : A Free Material Design Blogger Template
  • How to add Custom Fonts in Blogger or Any Website
  • How to use full ISP bandwidth to speed up downloading
  • Download Materiality Blogger Template
  • Resume Lite - One Page Resume Blogger Template
  • Best Social Media Widget for Blogger | 2017
Email Newsletter

Get Latest Posts Directly Into You Inbox

Labels

Android blogger browser Buy computer css drop down menu Gadgets Google how to internet Laptops Mobile Phone phone responsive reviews SEO smartphone Social Media Social Share Widgets subscription box Template tool trick widget Wireless youtube
Powered by Blogger.

Popular Posts

  • High PR Forums That Can Bring You High Traffic
  • Sensational v2.0 Responsive Blogger Template
  • Materiality - Material Design Blogger Template
  • BloggerHero Free Premium Blogger Template
  • MaterialMix : A Free Material Design Blogger Template
  • [Fixed] Facebook Share Thumbnail Is not Showing on Blogger

Contact Form

Name

Email *

Message *

  • Home
  • About
  • Contact
  • Sitemap
  • Services
  • Request
  • Privacy Polciy

© 2013 BloggerHero.com. All Rights Reserved. Designed with Love for Everyone!