- Like
- Digg
- Del
- Tumblr
- VKontakte
- Buffer
- Love This
- Odnoklassniki
- Meneame
- Blogger
- Amazon
- Yahoo Mail
- Gmail
- AOL
- Newsvine
- HackerNews
- Evernote
- MySpace
- Mail.ru
- Viadeo
- Line
- Comments
- Yummly
- SMS
- Viber
- Telegram
- Subscribe
- Skype
- Facebook Messenger
- Kakao
- LiveJournal
- Yammer
- Edgar
- Fintel
- Mix
- Instapaper
- Copy Link
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:
Ready 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 125×125 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="http://imagelinkhere.com" alt="Your Blog Title Here" /> </td> <td align="center"> <textarea rows="6" cols="15"> <a href="http://yourblognamehere.com/" target="_blank"><img src="http://yourimagelinkhere.com" 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!
The printables shared on this site are FREE of charge unless otherwise noted, and you are welcome to download them for your personal and/or classroom use only. However, free or purchased printables are NOT to be reproduced, hosted, sold, shared, or stored on any other website or electronic retrieval system (such as Scribd or Google docs). My printables are copyright protected and I appreciate your help in keeping them that way.
If you download and use some of my printables and then blog about them, please provide a link back to my blog and let me know - I'd love to see how you are using them! Please be sure to link to the blog post or web page and not directly to the file itself. Thank you!
Finally got results.Thankyou your site has been the best on how to make my own grab blog button. Yippy! finally can do it myself. : )
Yeah! So glad that it can help you out!
It worked Fabulous!! thanks :)
I’m having the same problem…. How did you get the Text to display…..
Thank you!
If you want to send me the coding that you are trying to use, I can see if I can fix it. Not sure why it won’t display unless I can see what you’ve done {grins}. It’s the same coding I have in my sidebar.
Jolanthe,
It works! I just did it! It just takes me a bit longer to figure out all these “techy terms”. Thanks for coming to my rescue, I really do appreciate it!
It works just fine! I did it! Yaaay! (clap, clap, clap) Thank you so much for sharing your tutorial!
yeah!!! :) so glad to hear that you got it working!!!
Thanks so much for your help. Nancy brought me here. How do you center it?
I need the button to be above the text. I tried adding the but I don’t think I put them in the right spot. http://www.whoisdaniebell.com
send me an email directly and I can send you the coding. :)