This is a tutorial for those who don't know how to make a grab button, the easy way.
(blogger only)
click on the pictures to get a larger view.
click on the pictures to get a larger view.
1. First, you have to create an image using your favorite photo editor. The one I use the most is PicMonkey.com. The standard size for a grab button is usually 200x200. For a tutorial on how to create an button via PicMonkey, click here.
2. Then upload your image to your image hosting site, such as Photobucket.com or Flickr.com. You will want to keep this window open so you can copy the image url.
3. Log into your blogger account ( if you havent already). Click on "Layout" and then click on "Add a Gadget" where ever you want to place your grab button.
3. Then click on the widget that says "HTML/Javascript".
4. Copy and past the html code for your image in the "content" window.
5. Then click on "Rich Text" which is at the top of the "content" window.
6. After clicking on "Rich Text", your image should appear in the "content" window.
7. Select/highlight your image using your mouse. Make sure your image is selected/highlighted before moving on to the next step.
8. While your image is selected, click on the the "Create Link" button. Then, enter your blog url address. Ex: http://www.yourblogurl.com
9. Now, click on "Edit Html", which is at the top of the "content" window.
10. Clicking on "Edit Html" will take you back where you can see your image html code. Now the code should include your blog url address.
11. Select/highlight the your image html code in its entirety and copy it.
12. Underneath the code type in the textarea tags.
Ex.
<textarea></textarea>
13. Then paste the code that you selected/highlighted in between the textarea tags. Change the highlighted areas.
Ex.
<textarea><a href="http://www.yourblogurl.com"><img src="http://yourimageurl.png"/></a></textarea>
14. Now, click on "Rich Text" to see your Grab Button and Code.
15. And Voila! There is your image and your grab code underneath it.
16. Now Press Save, and your are all done!
To resize or align your grab button or grab buttons, click here for the tutorial.
For more tutorials on how to make your blog more lovely, click here!
Happy blog designing!
Great tutorial Rekita! I've made many grab box buttons but never via this method. I really like the ease of this and how each step is contained to one window!
ReplyDeleteI saw your comment on heart shaped sweat, and thought I'd come check out your blog! I absolutely love your blog design! It's so pretty! This tutorial seems really easy, I'll have to go check out your other ones!
ReplyDelete-Sarah
limitedspaceorganizing.Blogspot.com
This is a great article, Nicole! Thank you for sharing, I saw another method on another blog a while ago but hadn't tried it yet, it looks like this way has a few less steps! Awesome job! :)
ReplyDeletexoxo,
Gayle | Grace for Gayle
I pinned this, Rikita, but it still seems a bit difficult to do... I'm glad I had you do mine. :) Take care, Linda
ReplyDeleteWould love to have you add this to What to do Weekends also.
http://www.craftsalamode.com/2013/02/what-to-do-weekends-8.html
Thanks for the info! Maybe I'll finally make a button for my blog.
ReplyDeleteThis is awesome. Thank you for sharing :)
ReplyDeleteFantastic this was just what I was looking for!
ReplyDeleteStephanie
thank you so much for doing this post! I just made my button for my brand new blog! It was so easy!
ReplyDeletecrazyperfectlife.blogspot.com
So helpful! We, too, are obsessed with PicMonkey!! Love it! :) Great tutorial!-The Dose Girls
ReplyDeleteGood info! Thanks for sharing. I'm not sure that I've reached "grab my button" status, but I like it just the same. Visiting from SITS.
ReplyDeleteI am loving your tips! Thanks for sharing...visiting from SITS, but I think I am going to become a regular!! Need to sit down and try this out!
ReplyDeleteTHis is a really great tutorial! Bookmarking this.
ReplyDeleteHappy Monday!
Sheree
The Hartungs Blog
thehartungs.blogspot.ca
I can't wait to try doing this! Thanks!
ReplyDeleteI need help! BTW thank you for all of your tutorial they have been so helpful! My question is how can I get a bigger picture resized (shruken I guess?) to fit into the 200 x 200 format?
ReplyDeleteYou are awesome!
ReplyDeleteOK so awesome!!! I looked everywhere and tries so many and yours is the one that helped me the most. Thank you!!!
ReplyDeleteAwesome tutorial! Thanks!
ReplyDeleteI've had to reference this post at least twice in the last month! So grateful for your little design tips, I can always count on them!
ReplyDelete