MintShare – Pure CSS & HTML Based Social Share Widget

Hundreds of social bookmarking plugins / widgets available on the Internet. So you may ask, why do we need another. Ok, let me tell you why we made MintShare in a simple way. Mint Share is one of the few CSS and HTML based widget. At our Bloggermint lab, we spend good time to come up with this widget. Made based on CSS & HTML without using any Javascripts,  these buttons are really fast-loading and small in size. Thanks to Paul Robert Lloyd for the beautiful social media icons.

We’ve used some CSS3 effects such as border-radius, box-shadow and transition. These CSS3 effects are only visible in Mozilla Firefox, Google Chrome, Safari and other CSS3 supporting browsers except IEs and the transition/animation effect is only visible in Webkit browsers.

For Blogger

1. Sign into Blogger > Design > Edit HTML. Check or tick [/] the ‘Expand Widget Templates‘ at top right corner of editor.

2.  Click on any of the ‘CSS‘ link below to get the CSS code of the button that you wish to use. Copy the CSS code and paste it just before </b:skin> closing tag in your Blogger Template.

3.  Copy the HTML code of the button you wish to use by clicking on the ‘HTML‘ link placed next to ‘CSS’ link.

4.  Now, search for <data:post.body/> using CTRL+F. Paste that HTML code immediately after <data:post.body/> tag and click ‘Save’.

MintShare Mini

MintShare Mini Social Share Button

MintShare Compact

MintShare Compact=

MintShare Classic Float Left

MintShare Classic Social Share Button

MintShare Classic Float Top

MintShare Classic Social Share Button

MintShare Compact Float Top

MintShare Compact=

For WordPress

Click the button below to download the WordPress Post Share URLs ready source file.

For HTML Websites

Click the button below to download the Post Share URLs ready source file.

Don’t forget to share your thoughts about our work!

January 10, 2011. This entry was posted in Blogger, CSS, Tutorials, WordPress and tagged , . Bookmark the permalink.

We Recommend HostGator Hosting

Bloggermint strongly recommends Hostgator Hosting for all of your web hosting needs. Sign up today for WordPress Hosting at just $4.95/month.

Use coupon code "bloggermint" to get 25% discount on any hosting packages. Get an account with Hostgator now!

86 Responses so far!

  1. Congo bro!! Awesome CSS Buttons! Awesome and now we can also reduce the loading time with this light weight buttons :)

  2. Nice…… Will be help full….

  3. wow.. Nice.. social Plugin…. its really cool.. lets add this in my blog to get some attraction :)

  4. Pingback: Tweets that mention MintShare - Pure CSS & HTML Based Social Share Widget | Bloggermint -- Topsy.com

  5. Pingback: MintShare – Pure CSS & HTML Based Social Share Widget | Bloggermint | Blog Links

  6. Pingback: MintShare – Pure CSS & HTML Based Social Share Widget | Bloggermint » Web Coding Unravelled

  7. Pingback: MintShare – Pure CSS & HTML Based Social Share Widget | Bloggermint | Blog Links

  8. Pingback: HTML all you need to know» Blog Archive » MintShare – Pure CSS & HTML Based Social Share Widget | Bloggermint

  9. Pingback: xhtml css templates – MintShare – Pure CSS & HTML Based Social Share Widget | Bloggermint | XHTML CSS - Style sheet and html programming tutorial and guides

  10. Pingback: MintShare – Pure CSS & HTML Based Social Share Widget | Bloggermint : : css

  11. Pingback: HTML Scripts Tips and Secrets » Blog Archive » MintShare – Pure CSS & HTML Based Social Share Widget | Bloggermint

  12. Superb plugin…

    Going to use this for my blog….

  13. Pingback: MintShare – Pure CSS & HTML Based Social Share Widget | Bloggermint - html

  14. great plugin . buttons look nice .will check it

  15. nice web, great article especially about blogger :D
    nice to meet you, salom from Beben si bloglang anu ganteng kalem tea
    yeahhhhh \m/

  16. Tho, I like the plugin’s look and feel, I’m not diggin the “Get MintShare” at the end of icons.

  17. “The content of elements must consist of well-formed character data or markup.”

  18. Wow ! Great tip ! Thanks for share !

  19. You are an excellent blog designer. This is an excellent widgets.

    Thanks for sharing the post.

  20. Pingback: 15 Super Cool CSS3 Navigation Menus And Tutorials | Bloggermint

  21. logical error on my blog…wew

  22. Pingback: Simplify Blogger Template | Bloggermint

  23. Wp plugin is Showing error while uploading :(

  24. Hi, I tried to use it on my blog but as soon as I put HTML code after , all my posts are not visible and so is this button. Not sure whats the problem. Any help?

  25. Pingback: Mint Mag - Free Premium WordPress Theme | Bloggermint

  26. i’ve tried to implement on my web, but i’ve got trouble with my EXPAND WIDGET TEMPLATES was not working, i still find for d answer till now:( any help? nice widget btw i will implent as soon as possible..

  27. hello i want to install this on wordpress ? i want it at the left ? where to add the code and which code to add ? i m new so plz assist…i really like this butto :-(

  28. Pingback: 10 Handly CSS3 Tools For Novice Web Developers | Bloggermint

  29. really cool, You guys rock!

  30. Hi..thanks for this…
    just wondering how to set up to wordpress?any help would be appreciate..
    Thanks guys

  31. trying to add this to a new upload of your “Smash Magazine Blogger template” that I am testing on my test blog. But every time I follow the instructions… it does not appear on the posts. or on the main page. I am trying to do the mintshare mini…

    can’t wait to get this on my blog as I really like your work.

  32. This is excellent thanks!

  33. I like these pure CSS social share widget. Thanks.

  34. It’s really awesome… I’ve didn’t see any share buttons like these. It’s completely amazing………..

  35. simplly awsume… social networks are very good source of traffic for which this plugin is just best

  36. nice…..but their is a little prob.i posted code correctly but their is no button.

  37. Awesome share bro!!
    just applied it on my site.

  38. very nice plugin thanks for sharing information, and this plugin is very useful for me. Thank you very much

  39. Pingback: CSS button, 110 best!

  40. Pingback: Most Hot Latest CSS And CSS3 Buttons, 110 Best Of The Best Sets !

  41. Thanks! But it does not work :(

  42. I have tried and tried, and while I do not get any error messages from the coding it simply does not show up on my blog.

  43. I got this error when I try to Activate it.

    The plugin does not have a valid header.

  44. wow nice share dude ………kep it up thankz

  45. Implemented it in one of my blog. thank you so much. :)

  46. have to admit – not the stuff I was looking for.

    i am looking for simple 2on2 html grid with main players: google+1, fb likes, twitter and delicious.

    anyway, thank you,
    Jools

  47. awesome collection man.thnx for sharing

  48. Pingback: Best plugins and widgets for Blogger : | Invesmo

  49. Excellent plugin :-”

  50. Looks great, thanks.
    Is there a way to add Linked In as well?
    And of course Google+, but I am not sure that can done without js.

    For optimisation, you might want to sprite the images into one.
    Cheers, Harry

  51. rencontre en ligne

  52. it is realty a good site .i like ur site.
    if u have

  53. Very cool effect buddy :) My blog looks cool with this widget ;)

  54. Hi,

    Can you explain how to use this on a wordpress site?

    Thanks

  55. Yes,
    I would also love to know how to implement this on WordPress.

  56. Hi, great post, but just can’t get this to work :/

    this paste the codes where you have told me but i still cannot see the buttons :(

    Not i firefox, not in chrome. what can I do?

    http://zagrebcity.blogspot.com/

    thank you in advance

  57. Pingback: CSS And CSS3 Buttons, 110 Best Sets ! | Free Website Template Center

  58. This is nice. Thanks a lot.

  59. Um, it kind of works, but doesn’t look the way it’s supposed to. IT just shows up as a bulleted list of icons

  60. Many thanks for this. Just what I was looking for.

  61. I like this,,,
    nice post…

  62. Can you please improve this so it will display share count with icons.
    Thank you.

  63. How To Put This in Dynamic Views ?

  64. good job!
    do you know the code to make it work for G+ as well?

    thanks a lot

  65. very nice article learned a lot form this.

  66. Thanks Bro It Was Best Social Sharing Buttons

  67. Thanks!
    I will definitely try this plugins

  68. Nice share!
    Hope this plugin works well.

  69. My website is a blog, but is of :(

    Cool, nice ! :)

  70. Thanks!
    We will try this share widget

  71. nice html and css ..and nice effact

  72. Thanks a lot !

    How can I add G+ icon ?

  73. so nice & so good, thnks a lot

  74. Hi. Nice idea. But I do need to ask a couple of questions:
    Why not use a sprite to combine all images into one (less DNS lookups->faster)

    2nd Why load images (suppose you can’t use a sprite) from a third party server in http? Will break all modern pages that run under sdch->https

    So my suggestion: Images into a sprite then user //doman.com/images/sprite to load to let the protocol be auto decided by the browser!

    Nice try. Some space for improvements! :)

  75. Pingback: Best blogger social media sharing widgets of 2012 | News !

  76. Pingback: Best blogger social media sharing widgets of 2012 | All The World

Leave a Reply

Your email address will not be published. Required fields are marked *

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>