Homeschool Creations

Wednesday, June 2, 2010

Grab my Button {Code Box on Right} Tutorial

Several of you have emailed me wanting to know how I made the ‘grab my button’ code in my sidebar horizontal, instead of the typical coding underneath the image. I changed mine around using a table format to free up a little bit of space in my sidebar. The one that looks like this:

imageReady for me to share some html coding with you so you can make your own?  You’ll have to add in your own links and html, but here are the instructions. 

I added this as an html gadget from my Blogger dashboard {if you have another blogging platform, I’m sure you know how to add an html gadget, right?}. Be sure that your sidebars are wide enough before you try to install it ~ my button is 125x125 and the text box adds at least another 150 pixels. In general, my sidebars are 300 pixels wide, so if yours are only 150, this will not work right!

Click on this lovely little box and then click the ‘html/java script’ button that pops up:


Copy and paste the code below and drop it into that html box. Before you hit save, you’ll need to do the following to the code below:

1. Replace the blue parts of the code below with the http link to your image {if you use photobucket you will be using the ‘direct link’ coding.

2. Replace the pink parts of the code below with your blog/website address.

3. Replace the purple parts of the code with your blog/website name. For example, I would use Homeschool Creations {make sure you keep the quotation marks in the coding}.

Try it out!! Grab the code, replace the highlighted coding and try it out on your blog! Let me know how it works for you. :)


<table width="100%"> <tr> <td align="center"> <img src="" alt="Your Blog Title Here" /> </td> <td align="center"> <textarea rows="6" cols="15"> <a href="" target="_blank"><img src="" alt="Your Blog Title Here" /></a> </textarea> </td> </tr> </table>


Note: I changed the % width on mine to 90% to make it a little bit smaller.

Don't forget to join Homeschool Creations on Facebook too!

Labels: ,


  • Okay thank you for the awesome tutorial but just one question...

    I can't get the box of text to display. How did you do that????

    So I created a button but no one can grab it because the text will not display.

    Thank you again for the great tutorial. It was so easy except for my lack in computer abilities for the actual text box to display.

    By Blogger Just an Average American Mom, At June 2, 2010 at 8:36 AM  

  • Thank you so much for the follow up.

    IT WORKED!!! I feel so techy now. (EXCITEMENT :) )

    I now have a button and a code on my blog.

    The Lord blessed me with a very wonderful lady to guide me through this.

    Thank you again.

    By Blogger Just an Average American Mom, At June 2, 2010 at 9:18 AM  

  • How cool! I like to pretend I"ll go someday and figure out how to do all of this stuff........ Someday, maybe.

    By Blogger Ticia, At June 2, 2010 at 9:30 AM  

  • I was wondering. . . on May 24th you wrote that you switched up your daughters math curriculum and said you'd share more later. I was just curious what you switched to, and why. We are making a few changes this year too! I just LOVE your blog. It has been a GREAT resource for us this year! Thank you!


    By Blogger Lisa, At June 2, 2010 at 11:20 AM  

  • I have been pulling my hair out for hours trying to make a grab box! Your simple instructions helped me! Thank you, Thank you, Thank you!!!!

    Virginia @

    By Blogger Virginia, At October 9, 2010 at 9:45 PM  

  • Thank you SO much for your Grab-My-Button Tutorial! I have tried 3 other websites and YOURS was the one that worked! I'd love to have you as a follower on my blog - I am a teacher in a Christian school and when I'm not teaching, I love to make things. Please visit, and thanks again!


    By Blogger Nan Burger, At November 27, 2010 at 8:05 AM  

Post a Comment

Thanks so much for stopping by! If you have a question and would like a reply, feel free to ask. I do my best to reply personally to you, but please be sure that there is an email linked to your comment or your profile! :)

Subscribe to Post Comments [Atom]

<< Home