I have helped several bloggers get their "Grab my button" widgets set up and thought I would create an easy to follow tutorial for anyone else that may need help. It seems there is a lot of code out there that just doesn't do the trick.
Here is the code that I have successfully been using for quite some time.
<div align="center"><a href="http://Blog URL" title="NAME OF BLOG"><img src="http://IMAGE URL.png" alt="BLOG NAME" style="border:none;" /></a></div>
<pre style="background:#f0f0f0;
In the above code there are 2 places for your images URL, 3 places for your blog name, and 2 places for your blogs URL. Make sure to change all 7 of those things. Your image MUST be online somewhere in order for you to use it. I suggest using notepad or wordpad to edit the html code. Once you have added your URL's and blog name you are ready to add your widget.
Adding your button to Blogger:
1. Once in Blogger click on "Layout"
2. "Add a gadget"
3. Scroll down and select HTML/Javascript
4. Type in a title like "Grab my Button" or you can leave it blank
5. Paste your HTML Code
6. Save
7. You may preview the widget and the location, but be sure to come back and click "Save Arrangement"
Adding your button to WordPress:
1. Once you are in your dashboard click "Widgets" on the left
2. Locate the "Text" widget
3. Choose a title if you wish.
4. Paste the HTML Code
5. Review your hard work and enjoy!
I hope you have found this tutorial useful! I would love to see your buttons, leave a comment below and I will stop by and check them out!
In the above code there are 2 places for your images URL, 3 places for your blog name, and 2 places for your blogs URL. Make sure to change all 7 of those things. Your image MUST be online somewhere in order for you to use it. I suggest using notepad or wordpad to edit the html code. Once you have added your URL's and blog name you are ready to add your widget.
Adding your button to Blogger:
1. Once in Blogger click on "Layout"
2. "Add a gadget"
3. Scroll down and select HTML/Javascript
4. Type in a title like "Grab my Button" or you can leave it blank
5. Paste your HTML Code
6. Save
7. You may preview the widget and the location, but be sure to come back and click "Save Arrangement"
Adding your button to WordPress:
1. Once you are in your dashboard click "Widgets" on the left
2. Locate the "Text" widget
3. Choose a title if you wish.
4. Paste the HTML Code
5. Review your hard work and enjoy!
I hope you have found this tutorial useful! I would love to see your buttons, leave a comment below and I will stop by and check them out!
I can't thank you enough for this post. I have tried several tutorials over the past week and I couldn't get any of them to work completely. Most resulted in my blog button with an empty grab box beneath it. Many of the codes I found wouldn't save properly to my blogger template. I'd plug them in, hit save, see that it didn't work, hit edit, and find that only part of the code had saved. I am completely new to blogging and web design so I was very frustrated...until I stumbled upon your tutorial. It worked like a charm the very first time. Thanks again!!!
ReplyDeleteStacey
Monkeying Around in First
So glad that this worked for you!!! Feel free to contact me if you need any further help. Good luck with your new blog!
Delete