Sunday, April 1, 2012

Freebies: Floating Share Buttons (for Blogspot)

These convenient sharing buttons open: Pinterest, FB like, Twitter, Tumblr, StumbleUpon, and WeHeartIt. 
Please comment below if you use these!

Ice Cream Cone

This floats on the bottom left of your screen; it is a single image that utilizes image maps and bookmarklet URLs.

1. Replace "IMAGE URL" with the image you want (right-click, copy image location)
2. Create a new HTML/Javascript widget and paste the code.
2. To adjust the position, change the percentage values for bottom:0%; and left:0%; you can also use top:0% or right:0%; (any combination of top/bottom and left/right should work).

Small


Large


DIY

{you could hypothetically customize the images to link anything you want, like your own posts, tags, etc.}

1. Copy the following images and edit accordingly; save the image as a PNG. If you're a student, your university might offer free Photoshop. If not, you can use Gimp or Aviary.

2.  Right-click and copy the URLs for the following bookmarklets, or use your own.

2. Use this image mapping website to create your own image map. When you input a URL, use the bookmarklet URLs. Copy the code.

3. Add this code to the beginning:


4. And this code to the end:
 

5. Upload the whole code into an HTML/Javascript widget.


Fabric Scraps

These float on the top left of your screen; they are separate images with bookmarklet URLs.

1. Right-click and copy the image URLs for either the large or small buttons; replace "FB URL", "TUMBLR URL", etc. with image URLs.
2. Create a new HTML/Javascript widget and paste the code.
2. To adjust the position, change the percentage values for top:0%; and left:0%;

Small:

Large:

Vertical:
 

 Horizontal:
 

Did you use these? Post your blog below!
  1. Call Me Clueless said... April 4, 2012 at 8:15 PM

    This is amazing! None of them fit my current theme at the moment, but I am so coming back to this the next time I do a design haul!

    Also, I gave you a blogger appreciation award! They're a bit silly and sort of a way to get more followers, but I really do love your blog!

    Thanks!

  2. kellyelizabeth said... April 10, 2012 at 5:00 PM

    OOOO I love these, so cute.

    I wanted to let you know I awarded you and your blog the Liebster Blog Award. its for up and coming bloggers who jsut started and I thought you really deserved it. Way to go!!!

    -kelly
    kellyelizzabeth.blogspot.com

  3. Ly said... April 10, 2012 at 5:56 PM

    OMG thank you for sharing these. I always love finding new tips to add to my blog :)

    http://www.lyzhang.com

  4. Melanie Beth said... April 21, 2012 at 11:54 PM

    Added to my blog - I've been thinking about doing something like this and yours is super cute, plus the ice cream theme fits close enough! You can check it out at www.killerzebras.com

  5. Ricquetta Francis said... June 8, 2012 at 7:07 PM

    I added it to my blog - www.vivalamakeuptv.com! I totally adore it even though it doesn't really go with my blog layout LOL! Yay! I just followed your blog, and I am already obsessed!

  6. Laura "Lala" said... June 19, 2012 at 8:09 PM

    I love your blog! You have wonderful graphic design skills, and I love your nail tutorials. That's why I awarded you a Liebster Award!

    http://cancandancer.blogspot.com/

  7. Xixia said... June 23, 2012 at 1:20 PM

    Oh these are adorable! Such a good idea - will need to consider switching to them! :)
    ♥ xixia
    visit my new blog?: thisisxixia.com

  8. Rachel said... June 24, 2012 at 6:36 AM

    i have a question... have you ever seen it below the profile picture, like on manyrandommusings.blogspot.com? do you know how i can do that? thanks:D

  9. Anonymous said... July 16, 2012 at 3:04 PM

    How do I make this a fixed gadget rather than a floating one?

  10. smita singh said... July 27, 2012 at 8:31 PM

    hi....very nice blog....and are u designer....nothing is mentioned on ur blog clearly abt u.

    Following u now thru GFC...hope u will also visit my blog and follow me...

    will wait for u

    http://smitazzworld.blogspot.in

  11. WonderHorn said... September 25, 2012 at 1:01 PM

    Super cute ideas...now I just have to get back into my photoshop and get to work...thanks for the inspirations!

  12. norcsikiss said... October 30, 2012 at 8:25 AM

    This is awesome....how can I put my twiter, facebook and pinterest in it?! and also how can I design one for bloglovin and instagram!? Can you please help me in it?! http://chic-from-thrift.blogspot.hu/

  13. mailey jayley said... November 5, 2012 at 7:33 AM

    nice dear but i still don't understand how to add it in my blog..can do other tutorial that more simple n easy to understand ... thanx

  14. S and F said... November 11, 2012 at 1:24 PM

    Absolutely love this, added it to my blog! ^-^

  15. SavingsInSeconds said... January 25, 2013 at 5:32 AM

    These are so cute! Now trying to figure out how to make it work with my links.

  16. Kim said... May 23, 2013 at 6:13 AM

    Thank you so much! I used them for my sewing blog (just starting) after my bf helped me figure out how to use them!

  17. Allie said... August 27, 2013 at 5:44 AM

    Love it! Thanks! Used them for my blog http://prettyawkwardlife.blogspot.com -- Loved them!

  18. jowdjbrown said... February 25, 2016 at 4:34 AM

    When I told him the real story of the Tea Party, he didn't believe me and looked at me in a way that made me think he was wondering if I was armed and if I'd shoot at him if he took a swing at me. best matcha powder perth

  19. Richard C. Lambert said... March 2, 2016 at 11:31 PM

    This floats on the bottom left of your screen; it is a single image that utilizes image maps and bookmarklet URLs. powder green tea perth

Post a Comment