Add PayPal Donate Button in WordPress

How To Add A PayPal Donate Button To WordPress

This article illustrates how to create a PayPal Donate Button in WordPress blogs, either in a post, page or as a sidebar widget. This guide is based on the new PayPal dashboard.

NOTE: This button is intended for fundraising. If you are not raising money for a cause, you should choose another option. See PayPal’s terms regarding Donations.

Step 1 – Log into your PayPal Account

At the bottom-left of the screen, select Classic Site.

PayPal Home Screen – Click Classic Site

Then, select your account settings by clicking on the cog wheel, top right.

PayPal Account Settings – Click the Cog Wheel

Select My Selling Preferences from the left PayPal menu.

Select My Selling Preferences

Beneath the top category, Selling online, choose PayPal buttons Update.

PayPal Buttons – Choose Update

Step 2 – Create or Manage PayPal Buttons

PayPal My Saved Buttons allows you to manage existing buttons that you have already created. Create a new PayPal button by selecting Create new button.

PayPal My Saved Buttons – Create New Button

Now configure your new PayPal button: –

• Select the button type: Donations
• Enter the name of your company or service name
• Choose your default currency
• Decide whether donors enter their own contribution or donate a fixed amount
• Under Merchant account ID, select Use my primary email address
• Click Create Button

PayPal – Create Button Configuration

Step 3 – Obtain the HTML Code for your new PayPal Button

Following the creation of your new PayPal Button, the next screen will show the HTML code to allow its use on other websites. For WordPress blogs, you need to select the Email tab and use that code.

PayPal Button – Email Code

Step 4 – Create the Full HTML Code for your PayPal Button

Right click on your desktop and select New > Text Document. Double click your new text file to launch it.

Highlight the following HTML code and copy it to your open text document:-

<a href="Paste the Email code from PayPal here" target="_blank" rel="nofollow"><img src="The Image Code" alt="" /></a>

Go back to the  Email tab in Step 3 and then click Select Code to copy the HTML code to your computer memory.

Then, in the text document, paste that code between the first set of quotation marks by using Ctrl v on your keyboard.

Copy the corresponding HTML code for the PayPal Button you wish to use and paste that between the quotation marks, replacing the words: The Image Code.

PayPal Donate Buttons and Code

https://www.paypal.com/en_US/i/btn/btn_donate_LG.gif

https://www.paypal.com/en_US/i/btn/btn_donateCC_LG.gif

https://www.paypal.com/en_US/i/btn/btn_donate_SM.gif

https://www.paypal.com/en_US/i/btn/x-click-but21.gif

https://www.paypal.com/en_US/i/btn/x-click-but04.gif

https://www.paypal.com/en_US/i/btn/x-click-but11.gif

Step 5 – Review the Full HTML Code of your new PayPal Button

When complete, the code in your text document should look something like this.

<a href="https://www.paypal.com/cgi-bin/webscr?cmd=_s-xclick&hosted_button_XXXXXXXX" target="_blank" rel="nofollow"><img src="https://www.paypal.com/en_US/i/btn/btn_donate_LG.gif" alt="" /></a>

It is very important to get the syntax correct. A missing quotation mark or slash symbol will prevent the code from working properly. If you have any problems applying your PayPal Button to WordPress in the next steps, revisit this code and check every detail in yours.

It’s also worth saving your progress at this point. Save your text document by selecting File > Save, or give it name by using File > Save As…

Add A PayPal Donate Button to a WordPress Widget

From your WordPress Dashboard, go to Appearance > Widgets

• Drag a Text widget to either your sidebar or footer.
• Open the Text widget.
• Enter a title for your PayPal Donate Button if you want to have one.
• In the larger text box, copy and paste the HTML code from Step 5.
• Click Save.

Add PayPal Donate Button HTML Code to a WordPress Text Widget

Now check your WordPress blog to see if the HTML code works. You should see the button you chose and when clicked, it should take you to the PayPal payment screen.

If you see the code itself, it means that there is an error. Go back to Step 5 and check the accuracy of your code.

Add A PayPal Donate Button to a WordPress Post or Page

In the WordPress Editor, select the Text tab.

WordPress Visual and Text Editor Tabs

Find the position in your post or page where you would like your PayPal Donate Button to be seen.

Copy and paste your HTML code from Step 5 to the WordPress Text Editor. Click the WordPress Visual tab, then scroll down to see if your PayPal button is displayed properly. If not, return to Step 5 and check the construction and syntax of your code.