April 08, 2014

Gadgets for Blogger


G is for Gadgets for Blogger

Gadgets can be especially useful in blogs to attract more readers/subscribers, to point them to addition posts, and even to help you promote. But some nifty gadgets you may see on other blogs can’t be found here, like a grab button for your blog, book or website, a LinkWithin Widget, and a Facebook Activity Feed Box.

Grab Button:

A grab button is more or less a picture embedded with a link. A box below your button allows people to copy the code and add your button to their blog to promote you. If people click on the button, they will be brought to your blog, website, book page, or any other site you want to bring more traffic to.


Here is the code you will need: 
<div align="center"> <a href="YOUR BLOG URL HERE" target="_blank"><img alt="YOUR BLOG TITLE" src="YOUR IMAGE LINK HERE"/></a> </div> <div align="center"> <form><textarea rows="6" cols="20"><center><a href="YOUR BLOG URL HERE" target="_blank"><img alt="YOUR BLOG TITLE" src="YOUR IMAGE LINK HERE"/></a></center></textarea></form></div> 

How to fix the code:


1. Where it says YOUR BLOG URL HERE put your blog url, staying between the quotation marks.

2. Where it says YOUR BLOG TITLE put the title of your blog.

3. Where it says YOUR IMAGE LINK HERE put the DIRECT link to the picture you want to use beginning with http://

(I got mine by using Photobucket and clicking on the "Get link codes" tab.)

How to add the code:

1. Once you substitute in your info go to "Layout" on your blogger profile, click "add a Gadget", click "HTML/Javascript", and then paste in the code you created. 

2. To see if it worked, click "richtext" in the HTML gadget window. It should show you an image of your button with the grab box. 
If you want to change the size of the grab box, click "edit HTML", look for where it says "rows=6" and "cols=20" in the code. By lowering the numbers the grab box will shrink in size. You may have to fiddle with this. Keep clicking "richtext" to see the outcome.

4. When you're done, save it!

5. Then go to your blog to see it came through correctly, and you’re done! 

Mine is in the left sidebar. Snatch the code and add it to your blog. Then tell me if you have a button so I can add it to mine too. :)


You can also try this code generator site: My Cool Realm


LinkWithin Widget:

What is a LinkWithin widget? Take a peek below my post, just above my comment box. You will see a headline that says “You might also like:” and below it are four pictures with blog titles. That is a LinkWithin widget. It is a great tool to prompt readers to check out other posts they may find useful.

To get a LinkWithin Widget go here: http://www.linkwithin.com/learn

On this page, go to the purplish-blue box on the right. Fill in your email, blog link, platform (Blogger, Wordpress), select a width, check the box only if your blog had light text on a dark background like mind, and then click “Get Widget!” It’s been a while since I created mine, but I believe it gets added automatically to your blog. 


Facebook Activity Feed Box:

If you would like to add a Facebook Activity Feed Box (which shows your activity on FB and lets people like your page) use this code:
<div id="fb-root"></div><script>(function(d, s, id) {  var js, fjs = d.getElementsByTagName(s)[0];  if (d.getElementById(id)) return;  js = d.createElement(s); js.id = id;  js.src = "//connect.facebook.net/en_US/all.js#xfbml=1";  fjs.parentNode.insertBefore(js, fjs);}(document, 'script', 'facebook-jssdk'));</script><div class="fb-like-box" data-href="YOUR FACEBOOK DIRECT LINK HERE" data-width="500" data-height="300" data-colorscheme="light" data-show-faces="false" data-border-color="black" data-stream="true" data-header="true"></div>
How to fix the code:

1.    Where it says YOUR FACEBOOK DIRECT LINK HERE, enter the exact link to your Facebook page beginning with http:// between the quotations marks.

2.    This code came directly from my blog because I couldn’t find the site I got it from, so I changed the color scheme to light. You can erase "light" and type "dark" between the quotation marks if your blog is dark like mine.

3.    I highlighted the width and height in case you want to modify it to fit your blog. These measurements match the box on my blog. 

How to add the code:

Go to "Layout" on your blogger profile, click "add a Gadget", click "HTML/Javascript", and then paste in the code you created. Save it, move the gadget wherever you want it to go, and view your blog.


I hope this helped you! 


A to Z Blogging Challenge:


60 comments:

  1. Very useful! thank you! I have been blogging for years, but I am still learning new things :)
    Thanks for stopping by! Happy A to Z!

    @TarkabarkaHolgy from
    Multicolored Diary - Tales of colors
    MopDog - The crazy thing about Hungarians...

    ReplyDelete
    Replies
    1. You're welcome, A. :) I, too, am still learning new things about blogs.

      Delete
  2. This is very helpful for me. I admit I'm terrible with gadgets and widgets. :)

    ReplyDelete
  3. Bookmarking this for sure! I appreciate the fact that you make all the instruction super clear.

    ReplyDelete
    Replies
    1. Great! When I was trying to find out how to add these gadgets correctly I couldn't find anyone who would explain it thoroughly, so I knew I had to do it to help others like me. :)

      Delete
  4. Ooh, some great tips here - didn't know about most of them. That is, how to do them. Thanks :)

    ReplyDelete
    Replies
    1. I hadn't known how to do these either until I pulled my hair looking into it and figuring it out myself. You're welcome, Trisha! :)

      Delete
  5. Great! I need this. Bookmarking it. Thanks, Chrys!

    ReplyDelete
  6. This is an amazing blog and if it weren't for the #atoz challenge, how would I have found you. Thank you for this great information.

    ReplyDelete
    Replies
    1. I'm so glad I signed up for the challenge this year so you could find my blog, Stepheny. I love knowing that my posts are helping you. :)

      Delete
  7. Thanks for the blogging tip on Google gadgets. Definitely bookmarking!

    ReplyDelete
  8. Loved this post. It's great to be able to fiddle with HTML and get the finished product that you want. Will be sharing this post :-)

    ReplyDelete
    Replies
    1. If I didn't know how to fiddle with the HTML codes, I wouldn't have been able to add these great gadgets. Thank you, J.C.! :)

      Delete
  9. Wow, Chrys these are awesome tips! I just added the facebook widget last week. I saw it on other people's sites and liked it so I googled how to do it. I've yet to see if it makes a difference in my facebook 'book' fan page LIKES. You're so smart!! What a great share. I'm amazed at your daily blogging too, that's a lot of work.

    ReplyDelete
    Replies
    1. Thank you, Lisa! I've noticed a couple of likes every now and then as a result of my Facebook Activity Feed so hopefully you will too. My secret to posting every day with this challenge was planning months ahead of time. ;)

      Delete
  10. I took some notes. This is just the kind of thing I need to learn.

    ReplyDelete
  11. Awesome. I'm kind of lame about this and will never make a badge, unless my publisher or tech force it on me, which let's face it, they might. I guess I better never say never, eh?

    ReplyDelete
    Replies
    1. Never say never. lol I only made a badge for my blog. I'm not sure if I'll ever make a badge for a book, but I didn't say never. ;)

      Delete
  12. I really should make some kind of badge for my website, though I have no idea what it would say or what kind of picture or design it would have. I'm an amateur artist, but my experience is with drawing and painting, not graphic design.

    ReplyDelete
    Replies
    1. A badge is always nice. You could just create a badge with your name. It doesn't need a fancy picture. :)

      Delete
  13. I lost my favorite gadget or widget: Maukie the cyber cat. Its maker went out of bujsiness. Bummer. :-(

    ReplyDelete
  14. More good stuff! Thanks!
    I'll have to make a badge sometime. I'll let you know!
    I was looking at your list of previous blogs and saw "Eating and Writing"...as I sit here with an open bag of chips...
    and then there's my cat on the other side. Do you know he's shut off my computer while I'm writiing? He just steps right on the power button and mashes down on it. End of session if I don't tell my computer that I'm sure I don't want to shut down in 10, 9, 8...
    Donna Smith
    The A-to-Z Challenge
    http://mainelywrite.blogspot.com
    Mainely Write

    ReplyDelete
    Replies
    1. HAHA! I love your comment, Donna! My cats like to curl up on my desk too. They push off the keyboard and lean against the screen, which always results in them turning off the screen power button. But the whole computer shutting down? OH NO!

      Delete
  15. LOL! Since I always forget to post, mine would be a Facebook Inactivity Feed Box.

    ReplyDelete
  16. You sound techno-savvy!
    Thanks for sharing these tips!

    ReplyDelete
    Replies
    1. Me? Techno-savvy? :D haha
      You're welcome, Michelle!

      Delete
  17. Awesome! I'm terrible with this stuff but your instructions are perfect! Thanks!

    ReplyDelete
    Replies
    1. You're welcome, Yolanda! I'm glad to help. :)

      Delete
  18. I hate gadgets. I can never get them to do what I want.
    Or get my blog to do what I want.
    bah

    ReplyDelete
  19. Thank you for all the great instructions! I will be bookmarking this for future reference! ♥

    ReplyDelete
  20. Hey, thanks -- I never knew about the linked within thing. :)

    ReplyDelete
    Replies
    1. You're welcome, Nicki! LinkedWithin is a neat gadget. :)

      Delete
  21. Great tips, Chrys! I'm sure they will come in handy.

    Thanks for all the blog love during this challenge. Much appreciated. :)

    ReplyDelete
    Replies
    1. Thanks, Holli! And you're very welcome. Much deserved. :)

      Delete
  22. This is very good info! I'm sure a lot of AZers would benefit from this.
    Damyanti, Co-host A to Z Challenge April 2014, My Latest post

    Twitter: @AprilA2Z
    #atozchallenge

    ReplyDelete
  23. This is really helpful stuff! Thanks for sharing.

    ReplyDelete
  24. You are a wealth of information! Thanks for the codes. :)

    ReplyDelete
  25. This is really useful information, Chrys. I am lacking in the gadget and widget department. Actually, I'm quite awful at it! I imagine if I sit down and read over your post here several times, it would be very helpful in finally learning how to make my way around my own blog. I'd love to insert some different tabs and what not. Once I find time, I know exactly where to go!

    ReplyDelete
    Replies
    1. I hope this helps you to add gadgets to your blog, Gina! :)

      Delete
  26. Many thanks for your help, Chrys. I 'grabbed' a button for this blog hop I'm doing soon...it felt like a miracle! Now I'm prepared to learn more about the process...so your timing was great!

    ReplyDelete
    Replies
    1. That's awesome, Rolynn! I'm super happy to help. :D

      Delete
  27. You are a goddess, Chrys. Also incredibly smart and talented. Thanks for taking the time to do this for those of us who are terminally tech-challenged.

    ReplyDelete
    Replies
    1. Aw! You're welcome, Darcy. I had a hard time with it until I figured out the tricks, so of course I had to share those tricks. :)

      Delete
  28. I love the idea of creating a Grab Button! I never thought of doing that for my own blog, but I guess it's possible that someone may want to grab it. :) Thanks!

    Random Musings from the KristenHead — G is for 'Grimm' (and Goofing Off)

    ReplyDelete
    Replies
    1. You're welcome! I don't know if many people have grabbed mine but I still like the idea, too. :)

      Delete