“Buy Me A Cup Of Coffee,” Feed My Kitty, and Other Donations
This tutorial relates to a review I finished recently of my five favorite online photo and image editors (you can read more about Pixlr, Sumo Paint, Google’s Picnik, Adobe Express and Aviary here) and an earlier article for freelancers on how to make money with photography (discover that sage advice here).
My favorite program was Pixlr, and as a test I created a small (and I admit, rather ugly) 150 x 150 pixel logo that I can use with my ClickDip website as part of a donation Gadget (ClickDip’s hosted by Blogger, so we’re talking about gadgets instead of WordPress widgets). ClickDip presents tutorials aimed at resurrecting old computers and preparing them to be donated to high school students at risk.
I created my first PayPal donate button for PhotoHow2 (go ahead, feed the kitty!). Creating the button was easy. PayPal provides the HTML code, which you simply copy and paste to your site. Donors can then click the button to make donations. You can use PayPal to accept donations made with a credit card, debit card, or with PayPal itself, there are no monthly set-up or cancellation fees (but there are low transaction fees), and donors don’t need a PayPal account to make a donation.
I wanted to write a tutorial for Blogspot users since a good number of the blogs hosted by the free Google service, including ClickDip, are community based or non-profit, and are therefore looking for simple ways to raise revenue. Beside, making a donate button gadget is a cinch, so why not tap into the power of PayPal and possibly pay a few bills in the process?
Create A PayPal Donate Button
- Start by heading over to PayPal and setting up an account.
- Log in, and then click on “Merchant Services” in the top menu bar.
- Under “Create Buttons” click “Donate.”
- In Step 1, type your organization’s name, skip “Donation ID,” and click on “Customize text or appearance” and choose the options you would like for your buton.
- Choose your currency, a contribution amount (I chose to have donors choose their own amount), and whether you want to use a secure merchant ID or your PayPal account’s email address.
- In Step 2, choose “Save button at PayPal.”
- Fill out the required information in Step 3 and you’re done! Note: I would recommend using the first two check-boxes to delineate where you would like donors to be directed if they cancel the transaction (back to your website), or if they complete the transaciton (to a static “thank you” page).
- Oh, don’t forget to click “Create Button.”
After creating your PayPal donate button and clicking “Create Button” you’ll be taken to your html code. (If you’re using this tutorial to set up a donate button on a WordPress site, make sure that you use the “Email” version of the code in your text box widget, not the “website” version. Counter-intuitive, but trust me.) For Blogger users, use the “Website” version of the code.
Set Up Your PayPal Donate Button In Blogger
Go ahead and hit “Save,” and refresh your open website to have a look at the new gadget area. You should see a box with a title and a donate button–I’m going to add the image and some more text to spice it up. The image I used for the PhotoHow2 donate box comes from my Flickr site, but the ClickDip logo isn’t hosted anywhere and Blogger doesn’t give me the ability to upload and store media items like I can with WordPress (I also didn’t want to post my ugly little ClickDip logo to Flickr). So I uploaded the image to my ClickDip folder in Picasa and choose the newly created image (0r the folder containing the image and then the image itself). On the right side of the page I picked “Embed image” and then copied all of the text in the box presented.
Next, I reopened my Blogger gadget window and pasted the text above the donate button text. The Picasa code contained a link to the folder storing the image, so I changed the address to point to the PhotoHow2 article where the logo was designed, and I changed the link title to read “PhotoHow2″–now the small text at the bottom of the image reads, “From PhotoHow2″ instead of “From [the image's folder name],” and links to the PhotoHow2 post about the free online image editor I used to create the logo.
I wanted my PhotoHow2 donate button to be centered, so I added “<div align=”center”>” to the beginning of the code and a closing div tag (</div>) to the end of the text, but I was happy with the location of the Blogger donate button, so I hit “save” and considered the task accomplished.
That’s how you add a PayPal donate button to your Blogger blog. For more information about setting up a donate button, visit the PayPal website here.