HomeOur StoryLetterAdoption TodayWhat Are We Doing?Links
ShaneMeganCarterRubyPhotosContact Us

How to Create an Adoption Button For Your Blog

(If you get stuck, feel free to contact me )

 

  1. Choose a picture
  2. Add text using your favorite photo editor.  Ask a friend if you need help with this step.
  3. Resize the picture to fit nicely on a web page.  120x120 pixels is a good size.  Remember it needs to fit on other’s blogs without being invasive.
  4. Go to www.photobucket.com and create an account.  (You need to have your picture hosted online somewhere for your button to work.)
    1. Login to your new account
    2. Click on Choose Files button.  A new window will open.
    3. Browse to the image you just created and click Open.
    4. Scroll down to the image on your main photobucket page.  Click Share.
    5. Click on the “Get link code” tab
    6. Copy the entire line under the “Direct link for layout pages” title. It should look something like this: http://i243.photobucket.com/albums/ff316/shaneandmegan/AdoptionButton.jpg
  5. Using the following HTML code as a reference:

 

<a href="http://yourblog.blogspot.com" target="_blank"><img border="0" alt="Hoping to Adopt" src="http://www.photobucket.com/yourimage.jpg"/></a>

 

  1. Replace http://yourblog.blogspot.com with your adoption website or blog address.
  2. Replace http://www.photobucket.com/yourimage.jpg with the address you copied from photobucket in step “f” above.
  3. You now have the final code to pass on to friends and family.  Make sure you keep it as one continuous line to avoid problems.  You can email this code to friends and family, post it on Facebook, or put it on your blog.  Here is the Facebook post I made as an example:

Any of you that would like to add our adoption button to your blog, copy and paste this code into an HTML gadget in your blog layout:

<a href="http://www.meganandshane.com/" target="_blank"><img border="0" alt="Hoping for Another Miracle!" src="http://www.meganandshane.com/MiracleButton200x120.jpg"/></a>

Thanks for helping us spread the word!

·          Optional: To make it easy for friends and family to add your button, here is example code for putting an HTML gadget on your blog with a text field containing your button code for easy copy & paste (Change bolded areas to match your button):

<h2 class="title">Add Our Adoption Button to Your Blog!</h2>

<a href="http://www.meganandshane.com/" target="_blank"><img alt="Hoping to Adopt" src="http://www.meganandshane.com/MiracleButton200x120.jpg" border="0" /></a>
<pre>

Copy and paste the following code into an HTML gadget in your blog layout:

</pre>
<pre>

<textarea rows="4" cols="22"><a href="http://www.meganandshane.com/" target="_blank"><img border="0" alt="Hoping for Another Miracle!" src="http://www.meganandshane.com/MiracleButton200x120.jpg" /></a></textarea>
</pre>

 

It will look something like this in your sidebar

Add Our Adoption Button to Your Blog!

Hoping for Another Miracle!
Copy and paste the following code 
into an HTML gadget in your blog layout:

 
 
 
Home        Our Story        Letter        Adoption Today        What Are We Doing?        Links        Shane        Megan        Carter        Ruby        Photos        Contact Us