How to Make a Blog Button With Boxed Code

Hey lovely friends. It's time for another tutorial. We've had so many requests and thought it was a great idea to put as many 'How To's' on FTLOB, so you'll be able to do these things yourselves and become familiar with HTML. Everyone who owns a blog should definitely have a button to share. This is a great way to advertise your sites and get noticed.

This is our Tasty Tuesday Button-

fortheloveofblogs




So it's really simple once you get the hang of it. In order to "Share" Your buttons, you need the html code box underneath it for viewers to grab.

Make Your Button On Photoshop using your favorite photo. 125X125 is usually the size most people go with but you can make it whatever size you wish. If you don't have photoshop or a similar software program, Picnik is a great place to make your buttons. {If you need help just holler}

After you have made a button like this:

fortheloveofblogs
Head over to Photobucket, tinypic or any other photo uploading site. Upload your pic and get the direct link code. You will replace that code with the RED Below:

Go To Design, Add a Gadget, Add HTML and Put in the Following Code:

Just Replace Everything in RED with Your URL, Your Blog Title and the Direct Link Code from Photobucket or wherever you upload your pics:

<center><a href="http://forblogs.blogspot.com/" target="_blank" title="YOUR BLOG TITLE HERE"><img alt="YOUR BLOG TITLE HERE" src="http://i141.photobucket.com/albums/r70/VICKT80/1.jpg" /></a> <center>
</center>
<center><textarea id="code-source" name="code-source" rows="3"><center><a href="http://forblogs.blogspot.com/" target="_blank"><img border="0" src="http://i141.photobucket.com/albums/r70/VICKT80/1.jpg" /></a></center></textarea></center><center></center></center>

And SAVE-

You Should Have a Button with a Code Box-

Now everyone can grab your style!:)

Have fun making those Buttons!

FYI: if you delete the photo from photobucket, it will no longer be available. If you switch your buttons and/or delete the old, email us the new button for The Community Page. Some of yours were deleted leaving us to delete the codes.

Enjoy the eve. And feel free to ask for more tutorials. We're happy to do them for you:)

31 comments:

No. 7 said...

I zoned out...I'm button-stupid. Can I pay someone to make mine? LOL.

Jenifer said...

So funny!! I have been trying to figure out how to do that since September!!! FINALLY on Monday I figured it out. :)

Sarah the Writer said...

I actually learned how to do this from another site, but the directions were exactly the same. Very easy to follow and awesome results :)

posidanielle said...

This is so sweet of you all to post this! I hope that everyone fines this useful!

melody-mae said...

man, I feel a bit out of my league here but, maybe I will give it a go this weekend. ;) if not I will be hollering out to ya! hehe

Trina Curran said...

Oh, yay! Thank you! :) Nooowwwww....maybe I can do it!

-Mallori said...

Thank you for posting this! It took me about 2 months to figure mine out, but I'm very pleased with my button now!

Ashly@Moon Walk said...

Thanks so much for this. I have been dying to make one for my blog but I didn't know how. I appreciate it. I will let you know how I make out.

Allison {Live Love Small} said...

i have been searching tutorials to try and figure this out and haven't been able to until this post. thank you! i think i did it and will need to test it out.

AubrieAnne said...

Thanks for this. i was trying to figure out how to do this about 3 days ago. Lucky for me a friend was willing to help me out and I got it all sorted in less than a few minutes. I'm glad someone did a tutorial on it though. I bet it will help a lot of bloggers and their great buttons!

AubrieAnne @ http://whosyoureditor.blogspot.com/

Lilianna Grace said...

Thank you so much for posting this. It's awesome! I wish I had known this before I paid someone for a buuton! :(

Ashley said...

This is great, I love the tutorials!

you can call me ki... said...

Thank you so much! It finally makes sense!!
Xo...
Ki

Branson said...

It took me forever to figure this out back when I did mine! Thanks for sharing!

Shalyn said...

I love that you guys are doing tutorials now- I love FTLOB!

rebecca said...

This is great. thank you so much. I was wondering how to do this myself

Kassi @ Truly Lovely said...

Thanks for sharing this tutorial! Now everyone can make their own buttons!!

b. lee said...

just made my 1st button! holla * thanx so much for the instructions ~ soakin' all this junx in one step at a time * thanx, again :D

Jodi said...

Ok I still need more help - can someone tell me how to make a badge in Picnik? I don't want to use a photo.
jodibeansblog@gmail.com
Thanks

HM said...

Hi, I just wanted to say THANK YOU for you tutorials...they are GREAT!! I've been wondering how to do this button thing for a month now haha. Kepp the tutorials coming...they are an AWESOME resource for not-so-blog-savy people like me :o)

country living said...

Thank you, Thank you, Thank you!!
Stephanie!
http://wheninthecountry.com

country living said...

Sorry, http://wheninthecountry.wordpress.com

Lindsay said...

So excited to finally know how to make a button! Thanks for the tip!

ifbyyes said...

I have been looking all over for a good explanation! Thank you!

Phases Of Me said...

A little behind here, lol, but I got my button made today thanks to the tutorial! Thank you!

Caffeinated OC Mommy said...

My Darling Vic, once again YOU are my hero! xoxo

Elizabeth said...

You explained it perfectly and it was so easy to follow! Thank you. Now I have my own button!

Kelly @ ThrivingWith5 said...

Thanks so much for posting this! I have this on my to do list!

Michelle said...

I need major help with my button! I can post it on my page, but my picture doesn't show up.. it says it's been removed from photobucket, but I haven't done anything to it? Can y'all help me? :)

Desire said...

Where do I find or create an image if I don't already have one? Btw, thanks for this site, I love it! I actually found it through a FTLOB button posted on a member's blog! I am new to this world...so all the assistance anyone could provide would be very helpful. Thanks!

JoAnn said...

Great site !
1)Can you tell me if I have to use a 3rd party to host the graphic or can I just use my own hard drive ?

2) When I type my URL, some blogs automatically create a link but not all. How can I create a link on a blog that doesn't do it automatically?

Members: Join Us

Follow by Email

Search This Blog

Google+ Followers