Presenting The Animated Social Bookmarking Icons Set – The Flapper


After creating the Circular Style and Trigonal Style Social Bookmarking Icons, I decided why not create some animated social media icons set, which may look professional, eye-catching and yet unique! I am excited to have successfully published our third Icon set which is different in every aspect. See it for yourselves. Hover your mouse cursor over the icons below to see the flapping effect.
The download file below contains The Flapper Icons Set. All these icons are available in png format and in sizes 32px, 48px, 64px and 128px.
Downloads:
To add these icons to your blogs, websites, forums etc use the respective codes below,
<!-- DELICIOUS CODE STARTS --> <img width="" height="" onmouseover="this.src='http://4.bp.blogspot.com/_7wsQzULWIwo/SqGDqvOi6_I/AAAAAAAABwU/V1wp5He0Va8/s400/DELICIOUS1.png'" src="http://3.bp.blogspot.com/_7wsQzULWIwo/SqGDq_yQIKI/AAAAAAAABwc/oFKdjffGT7Q/s400/DELICIOUS2.png" onmouseout="this.src='http://3.bp.blogspot.com/_7wsQzULWIwo/SqGDq_yQIKI/AAAAAAAABwc/oFKdjffGT7Q/s400/DELICIOUS2.png'"/> <!-- DELICIOUS CODE ENDS --> <!-- RSS CODE STARTS --> <img width="" height="" onmouseover="this.src='http://3.bp.blogspot.com/_7wsQzULWIwo/SqGGvLkLbZI/AAAAAAAAByU/UAY0e3H8skU/s400/RSS1.png'" src="http://1.bp.blogspot.com/_7wsQzULWIwo/SqGG68DCUFI/AAAAAAAAByk/eqXDid_DUZY/s400/RSS2.png" onmouseout="this.src='http://1.bp.blogspot.com/_7wsQzULWIwo/SqGG68DCUFI/AAAAAAAAByk/eqXDid_DUZY/s400/RSS2.png'"/> <!-- RSS CODE ENDS --> <!-- YOUTUBE CODE STARTS --> <img width="" height="" onmouseover="this.src='http://4.bp.blogspot.com/_7wsQzULWIwo/SqGGuULHk1I/AAAAAAAAByE/FbPpFQBC6nA/s400/YOUTUBE1.png'" src="http://4.bp.blogspot.com/_7wsQzULWIwo/SqGGu3pt6nI/AAAAAAAAByM/QyIAvpL6N9Q/s400/YOUTUBE2.png" onmouseout="this.src='http://4.bp.blogspot.com/_7wsQzULWIwo/SqGGu3pt6nI/AAAAAAAAByM/QyIAvpL6N9Q/s400/YOUTUBE2.png'"/> <!-- YOUTUBE CODE ENDS --> <!-- YAHOO CODE STARTS --> <img width="" height="" onmouseover="this.src='http://1.bp.blogspot.com/_7wsQzULWIwo/SqGGttGnNZI/AAAAAAAABx0/q5eZRUfgfNc/s400/YAHOO1.png'" src="http://2.bp.blogspot.com/_7wsQzULWIwo/SqGGtycf68I/AAAAAAAABx8/TOF9DuD7n10/s400/YAHOO2.png" onmouseout="this.src='http://2.bp.blogspot.com/_7wsQzULWIwo/SqGGtycf68I/AAAAAAAABx8/TOF9DuD7n10/s400/YAHOO2.png'"/> <!-- YAHOO CODE ENDS --> <!-- TWITTER CODE STARTS --> <img width="" height="" onmouseover="this.src='http://2.bp.blogspot.com/_7wsQzULWIwo/SqGGZCTqMOI/AAAAAAAABxk/eAIBpRqgJiE/s400/TWITTER1.png'" src="http://3.bp.blogspot.com/_7wsQzULWIwo/SqGGZlcpt1I/AAAAAAAABxs/KUZHX71eimo/s400/TWITTER2.png" onmouseout="this.src='http://3.bp.blogspot.com/_7wsQzULWIwo/SqGGZlcpt1I/AAAAAAAABxs/KUZHX71eimo/s400/TWITTER2.png'"/> <!-- TWITTER CODE ENDS --> <!-- TECHNORATI CODE STARTS --> <img width="" height="" onmouseover="this.src='http://4.bp.blogspot.com/_7wsQzULWIwo/SqGGYWGbF8I/AAAAAAAABxU/o5IHL_Ciwss/s400/TECHNORATI1.png'" src="http://1.bp.blogspot.com/_7wsQzULWIwo/SqGGYzi6R6I/AAAAAAAABxc/4Ib3ueGU4Oc/s400/TECHNORATI2.png" onmouseout="this.src='http://1.bp.blogspot.com/_7wsQzULWIwo/SqGGYzi6R6I/AAAAAAAABxc/4Ib3ueGU4Oc/s400/TECHNORATI2.png'"/> <!-- TECHNORATI CODE ENDS --> <!-- REDDIT CODE STARTS --> <img width="" height="" onmouseover="this.src='http://1.bp.blogspot.com/_7wsQzULWIwo/SqGGJWOkYZI/AAAAAAAABxE/_cOecHZDRsY/s400/REDDIT1.png'" src="http://2.bp.blogspot.com/_7wsQzULWIwo/SqGGYGTSWrI/AAAAAAAABxM/49lKyrQBSoA/s400/REDDIT2.png" onmouseout="this.src='http://2.bp.blogspot.com/_7wsQzULWIwo/SqGGYGTSWrI/AAAAAAAABxM/49lKyrQBSoA/s400/REDDIT2.png'"/> <!-- REDDIT CODE ENDS --> <!-- FACEBOOK CODE STARTS --> <img width="" height="" onmouseover="this.src='http://4.bp.blogspot.com/_7wsQzULWIwo/SqGGIS5ncrI/AAAAAAAABw0/LaZwhbVchUQ/s400/FACEBOOK1.png'" src="http://2.bp.blogspot.com/_7wsQzULWIwo/SqGGI-67dFI/AAAAAAAABw8/60pD0Cixu3Q/s400/FACEBOOK2.png" onmouseout="this.src='http://2.bp.blogspot.com/_7wsQzULWIwo/SqGGI-67dFI/AAAAAAAABw8/60pD0Cixu3Q/s400/FACEBOOK2.png'"/> <!-- FACEBOOK CODE ENDS --> <!-- DIGG CODE STARTS --> <img width="" height="" onmouseover="this.src='http://3.bp.blogspot.com/_7wsQzULWIwo/SqGGHk_dvrI/AAAAAAAABwk/kmAe1jCxrGA/s400/DIGG1.png'" src="http://2.bp.blogspot.com/_7wsQzULWIwo/SqGGII4WnFI/AAAAAAAABws/F_7d2L5yFfA/s400/DIGG2.png" onmouseout="this.src='http://2.bp.blogspot.com/_7wsQzULWIwo/SqGGII4WnFI/AAAAAAAABws/F_7d2L5yFfA/s400/DIGG2.png'"/> <!-- DIGG CODE ENDS -->
You can add these Flapper icons anywhere you like by copy-pasting the code for a specific Icon into your blogs and websites. The size of these images can be altered by giving width="" height="" some value. For example if you want to show icons of size 48px by 48px, then change the width and height as follow -> width="48px" height="48px" . The default icon size in the code above is 128px by 128px. Try to use any size less than 128px but not greater than that, else the icon will look blurry. I will soon write a post on how to add these icons just below your blogspot posts. Further I am going to release a new Icon set soon, so make sure you subscribe and don't miss the next surprise!. Any feedback is appreciated. Your comments is what I need as a token of favour :>

Need Quick Help within 24 Hours? ASK NOW



If you don't want to get yourself into Serious Technical Trouble while editing your Blog Template then just sit back and relax and let us do the Job for you at a fairly reasonable cost. Submit your order details by Clicking Here »

20 comments : Post Yours! Read Comment Policy ▼
PLEASE NOTE:
We have Zero Tolerance to Spam. Chessy Comments and Comments with 'Links' will be deleted immediately upon our review.

  1. Nice icons my friend. Are you the one who made this? Nice job...

    I hope you teach us how to apply it in our blogs. Thanks a lot

    ReplyDelete
  2. @Felix

    Fortunately yes :) It took me three hours.

    I will surely share the code for adding them to your blogs.

    Regards,
    MOHD_

    ReplyDelete
  3. Great job MOHD. I am going to try one on my blog to see if it will work on mine. Those are terrific.

    ReplyDelete
  4. mohd GREAT JOB. THEY ARE FANTASTIC! KINDLY SHARE THE CODE SOON

    ReplyDelete
  5. @marg & @Jacob


    I am flattered to know that you liked the Animated Idea!

    ReplyDelete
  6. Question...can you do skype?

    ReplyDelete
  7. I have some posted on my blog:

    www.2wildwilly.blogspot.com

    I got them from here:

    http://www.bookmarkcraze.com/

    ReplyDelete
  8. Great Icons! How to I put them on my blog? That is to say, How Do I Connect them to RSS, Yahoo, Redit etc.?

    ReplyDelete
  9. @kaki

    Dear kakai, Use the code below to show them any where in your blog,




    <!--Delicious-->
    <a expr:href='&quot;http://del.icio.us/post?url=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title' rel='external nofollow' target='_blank'>Place The Image Code Here</a>

    <!--Technorati-->
    <a expr:href='&quot;http://technorati.com/faves?add=&quot; + data:post.url' rel='external nofollow' target='_blank'>Place The Image Code Here</a>

    <!--Twitter-->
    <a expr:href='&quot;http://twitthis.com/twit?url=&quot; + data:post.url' rel='external nofollow' target='_blank'>Place The Image Code Here</a>

    <!--DIGG-->
    <a class='Fadein' expr:href='&quot;http://digg.com/submit?phase=2&amp;url=&quot; + data:post.url' rel='external nofollow' target='_blank'>Place The Image Code Here</a>

    <!--Stumble-->
    <a expr:href='&quot;http://www.stumbleupon.com/submit?url=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title' rel='external nofollow' target='_blank'>Place The Image Code Here</a>

    <!--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'>Place The Image Code Here</a>


    Currently These Icons show animated effect on sidebars only but I will prepare a code soon to make them work under blog posts too.

    I hope that could help you to some extent

    ReplyDelete
  10. @kaki

    forgot onething. Replace the text "Place The Image Code Here" with the code for animated Icon

    ReplyDelete
  11. Hi MOHD_!

    Why doesn't it work when I place it through "Edit HTML" in blogger!

    ReplyDelete
  12. @Googy


    yes you are right they wont work inside blogger templates. The code is auto deleted due to some reasons. I am looking for someone to create a Javascript code for these icons to work in blogger. But they would work just fine on other web platforms like simple HTML webpages.

    ReplyDelete
  13. @Googy

    I have written a post on how to add these icons below blogger posts or in your websites,

    Read this post Social Bookmarking Widget For Blogger"

    ReplyDelete
  14. Nice set of icons - however , you should consider adding Stumbleupon & Flickr buttons as well - then this set will be complete :)

    Great Icons .

    Mia.

    ReplyDelete
  15. love u yar i caant seen editor ever like u....<3

    ReplyDelete
  16. Thanks the Generic Viagra Blog I could find this post, it is really interesting because I love the information in a free from , social-bookmarking is one of the best method today.....

    ReplyDelete
  17. Wow.. This is amazing.. After reading your post I decided to make my own animated social bookmarking icon set for my users. My blog is on blog tips and tricks. I'll use different image set to make a new animated sharing icon set for all the bloggers.

    Good luck.

    ReplyDelete
  18. جميل جدا أقوم بترجمة مقالاتك و اضعها في مدونتي باللغة العربية ، ان كنت توافق على ذلك

    لا أحب الكتابة باللغة الإنجليزية
    www.tiqniya.blogspot.com

    ReplyDelete
  19. Thank you very much brother for this image set. Wonderful social images. Awesome collection.
    Regards,
    Admin of manual article submission

    ReplyDelete
  20. i tried to install theses sociam medias icon.i installed them but theu do not work. tell me how theu will work

    ReplyDelete