Click Here to view this article as a PDF.
Author: Kristenson, Joel
Content Provided by: Panger, Mark
Last Updated: 2016-11-11
Overview
This article shows an example of the code needed to create a donation thank-you page that auto-populates the donor’s first name and donation amount to make it more of a personal experience.
Tip: Watch this video to get up to speed on creating the donation iFrame form. Watch this video to learn how to create the custom thank-you email that goes out. Read this article to learn how to customize your donation forms even further with the available URL parameters.
Steps
Here’s an example of what your donation form could look like using the javascript code below:
...you will need to add a little extra code (example below) to the Thank You page.
---
Thank you, <span id='fn'></span>, for making the generous contribution of $<span id='da'></span>. Your donation does make a difference.
<script language="javascript" type="text/javascript">
// Read page's GET URL variables and return them as an associative array.
// NOTE: this code must go below the HTML id's above
function getUrlVars()
{
var vars = [], hash;
var hashes = window.location.href.slice(window.location.href.indexOf('?') + 1).split('&');
for(var i = 0; i < hashes.length; i++)
hash = hashes[i].split('=');
vars.push(hash[0]);
vars[hash[0]] = hash[1];
}
return vars;
//Global Param
urlparms = getUrlVars();
// Assign the value to the message block above
document.getElementById('da').innerHTML = urlparms['da'];
document.getElementById('fn').innerHTML = urlparms['fn'];
</script>
The variables are fn and da for first name and dollar amount.
The related resources below link to a wide variety of similar articles and videos on how to create donation forms, customize them, and create the thank-you emails that go out to thank the donor when they give.
Related Resources
Article: How to Create a Custom Thank-You Auto-Responder with Merge Fields for your Online Donation Form
Article: How to Add and Remove Allocation Funds to your Online Donation Form, and to the Drop-Down Menus in your Database
Article: Custom Donation Amounts for Non-Primary Donation Pages – List of All Configurable Donation Page URL Options
Article: How to Add the Security Disclaimer Section to your Online Donation Form, and How to Style the Text Inside with html & CSS
Article: How to Configure Recurring Donation Options for your Trail Blazer Donation Form (must be using either Vanco Services or Authorize.Net as your Merchant Gateway)
Article: How to Put your Trail Blazer Donation Form on your Facebook Page
Article: Linking your Website to your Database with Configurable iFrame Forms
Article: Modify your Donation Form – Change the Amounts – Add Descriptions – Add & Remove which Amounts Display
Article: Configure Website (iFrames)
Article: Web site signup < iframe >
Article: Configure Website – Legacy Article
Article: How to Enable ACH (E-Check) Payments with the Vanco Merchant Gateway on Trail Blazer’s Donation Form
Article: Iframe tags for stylesheets
Video: Iframes
Video: Donation Auto Responders with Merge Fields
Video: Attributes – Add To Donation Page
Video: Contributions Online – Change Default $ Donation Amounts
Trail Blazer Live Support
Phone: 1-866-909-8700
Email: support@trailblz.com
Facebook: https://www.facebook.com/pages/Trail-Blazer-Software/64872951180
Twitter: https://twitter.com/trailblazersoft
* As a policy we require that you have taken our intro training class before calling or emailing our live support team.
Click here to view our calendar for upcoming classes and events. Feel free to sign up other members on your team for the same training.
* After registering you’ll receive a confirmation email with the instructions for how to log into the GoToMeeting session where we host our live interactive trainings.
* This service is included in your contract.
