Trail Blazer Knowledge Base

 

Home : Web Tools : How to Create a Custom Redirect Thank-You Page for your Donation Form(s) that Automatically Populates the Donor's First Name and the Donation Amount they Gave - Advanced Feature

Knowledge Base







User:

Password:



Article ID: KB134
Keyword Name: URL, Custom, Thank-You, Redirect, iFrame, JavaScript
Created: November 11, 2016
Viewed: 13695

How to Create a Custom Redirect Thank-You Page for your Donation Form(s) that Automatically Populates the Donor's First Name and the Donation Amount they Gave - Advanced Feature




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.



http://www.us-cert.gov/sites/default/files/images/tip-icon.pngTip: 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


http://www.somebodysattic.org/images/phone%20icon_lower%20rez.jpg  Phone:  1-866-909-8700

http://sisyphus-js.herokuapp.com/assets/email_icon-0f32f4da45c2822cbb02fb36f9b9429e.png   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.



 

Are you ready to learn more? Contact Us