Blog button and code!

Hey Ladies! Today over at Raising Arrows, Amy blogged about growing a blog. One of the links that she shared was to another blog (Like A Bubbling Brook) where Jamie blogged about how to create your own blog button. This has been something that I have been wanting to do, but my graphic designer husband is over worked, and hasn't, as of yet, been free to help me. So today, with the confidence gained from Amy and Jamie, I gave it a go! Here are my results (after many attempts, revisions and hours...):

<center><a href="http://servantwifemother.blogspot.com"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhtDnXJZOnbp_XwbgLOFzaQk51LgIoDa6i80C66o26dox7ljlLBdPsqJIJ6fZhA_G0J66RonVQdNHRmz_ky6D_ciat8fi0n9DGu78rj-15JM12mpR7KWd1pSxDrOcZGHhIDbj7OSsGn4oQ/s249/Blog+Button1.jpg" /></a></center>

Woo Hoo! I had to take Jamie's advice and combine it with Amy's working button. I'm so excited that I have this figured out!

Here are my steps:

1. I designed my button using illustrator, then copied it into photoshop into a 125 pixel x 125 pixel box, and saved it as a .jpeg

2. I then uploaded my button photo straight to my blog. I used a widget for pictures, to upload the photo, linking it to my main blog page url, and then saved the widget.

3. I then took the working code for Amy's blog button (Thanks, Amy!) and changed the info in the code to match my blog (my blog link and the link to my button photo that was now on my blog).

4. I then added the text box code that Jamie had around her button code that I couldn't get to work (I'm sure it was a user error).

5. Finally I uploaded all of that code text as the caption to my picture, and viola!

Pin It