It’ll take you less than 30 minutes to add a “give” button to your WordPress blog.

Here’s how to add a give button:

1. Go to this  button image  and download it to your computer (or find some different color buttons using a Google search… make sure they aren’t copyrighted).
2. Upload the button image to your Media Library in WordPress.
3. Edit the button image in the library and you’ll see in a grayed area on the right the “File URL.” You’ll need this for your text box widget code. Leave this open in a tab so you can grab it when you do steps 6 and 7.
4. Go to your Dashboard / Appearance / Widgets.
5. Drag a text box to the sidebar location where you’ll want your “give” button.  I recommend the “top of the fold,” that is, put your button where it will be seen when your website opens, not lower down where your reader will need to scroll to find it.
6. Notice the code in my text box at the bottom of the post. You’ll want to replace 0124650 with your staff account number. Also replace the URL for your button image (see step 3).
7. You can paste this dummy code and tweak it to look exactly like the code in the box below (remember to put in the giving and image URLs where I used blue): <a href=”your cru.give.org URL” target=”_blank”><center><img src=”URL for your uploaded give-button.png” align=”middle” width=”100px”></center></a>
8. Hit “save”.
9. Test the button to see if it works.
10. If your new give button doesn’t work, it could be because of pasting the quote marks. HTML computer code is particular about the types of quote marks.  Just highlight the quotation marks and type over them within the text box.  Repeat steps 8 and 9.
11. It’s optional to have a title for the text box. Try the text box with and also without a title to see which you like better. Repeat steps 8 and 9.
12. You can also experiment with different widths for the button to see what you like better.  Try 60px, 100px, and 300px. Repeat steps 8 and 9.
13. Great job! You did it! Add a link to your website in the comments below so I can see your site and “give” button.

UPDATE (02/05/2014): I’ve saved the original round button image for this article if you’d like to use it. However, after I posted this week on the importance of the size, shape, and placement of your give button for a mobile device, I switched the give button to a rectangular one. I highly recommend you read this article because half of your readers are using a phone to read your blog posts and emails.