How to Add Tithely Giving to Your Website: WordPress

Adding a giving button to your website doesn't have to be difficult or confusing! You can either use the direct link that takes people to your dedicated online giving form or you can embed your Tithely giving form right into your website using your embed code.

Using Direct Website Giving Link

Using your direct website giving link is the quickest and easiest way to allow donors to give from your website. Direct links are also great to use on social media, newsletters, or anywhere else you can place a link.

Note: WordPress has many themes with different steps for adding a button. These are the most generic steps that should allow you to complete adding your giving link. 

1. Log in to your Tithely account and select Giving.
2. Next, select Giving Form.
   • You'll be taken to the Giving Form Editor. From here, you can customize the styling of your Giving Form and preview those changes as you make them.
   • If you have multiple organizations (churches, campuses, ministries, etc) set up in your account, select the correct organization from the drop-down in the top-left corner of the editor:
3. From here, you will see a Giving Form URL.
   
4. Select the Copy button on the right side of the block.
5. Now, navigate to WordPress and locate where you would like to add the button. 
   Note: You will need to be in editor mode. Check out this help center article from WordPress for more information: How to add buttons on WordPress.
6. Select the + button on the page where you would like to add a button. 
7. Select the Button from the options. 
8. Click Edit on the new button. 
9. Add your URL from Tithely. 
10. Save and publish your site.

Using the Giving Form Embed Code

Please Note: Before attempting to embed a code on your website please make sure your Wordpress Website theme and/or subscription allows for custom code. If it does not you will need to use the Direct Website Giving Link method on this article or upgrade your subscription.

It is also important to know if your website is SSL secure. If your site does not has SSL security the Tithely giving button will warn users that the site may not be secure. You can tell is your site has SSL Security if it starts with HTTPS. If your site only starts with HTTP you do not have this and will need to contact your website provider.

Retrieving Your Tithely Giving Form Embed Code

1. Login to your Tithely account and select Giving.
2. Next, select Giving Form.
   You'll be taken to the Giving Form Editor. From here, you can customize the styling of your Giving Form and preview those changes as you make them.
   If you have multiple organizations (churches, campuses, ministries, etc) setup in your account, select the correct organization from the drop-down in the top-left corner of the editor:
3. From here, you will see an "Embed Code" text block. Simply select the Copy button on the right side of the block.

Putting Tithely Giving in WordPress

• Log into the admin side of your WordPress website.

• Select the page you would like to edit.

• If you have any text on this page, locate the area you would like the button to appear.

• Click on the “Add Block” button that appears on the left.

• From the list of Blocks available select Custom HTML and paste the code into the section provided.

• Select “Publish” to make your changes go live.

Please note: There may be a grey backing or other behind the green Tithely button. This is most likely because you are in editor mode and not live. Publish the page and view as a user on your site to view what it will look like live.

Please note: Using the embedded giving form keeps those who wish to give, on your website while they are making the donation. This method has been proven to work better by retaining trust and reducing steps.

ERRORS: Once you've added the custom code and published, or are viewing your page, the giving button may appear as only three broken lines of code with no image, or is a blank text that says ‘Give’ with no button. This may happen because your subscription or theme does not allow custom code. You will need to contact your provider to fix this and use method #2 for the time being.