Documentation

# Donation Tip-up

# How to add a tip-up to the Donation Form

  • Find an existing donation form that you want to edit and edit it.
  • Add an HTML Caption field to the list of fields in the Design Donor Screens > Donation Form.
  • Inside the HTML Caption insert the code [[S51:reus_donation__tip_up]] to insert the tip-up.
  • Arrange the field as needed, it should appear on the form in the same place it is placed in the administrative screen.
  • Note The tip-up feature must appear on the same page as the gift amounts, as the JavaScript code will compute the total value and write it into the other donation form before submission. As of 2022-04-26 there are no donation forms that appear on more than one pages. This was an decision made by Save the Children in 2016 when the Luminate was originally deployed and all possible variants have been considered.

# How to set the tip-up checkbox as checked

  • The tip-up checkbox is not checked by default.
  • To set the checkbox as prechecked edit the HTML Caption element that holds the tip-up code.
  • Insert the code [[U0:donationTipUpChecked=true]] before the code that inserts the tip-up.
    The final code in the HTML caption field will be:
[[U0:donationTipUpChecked=true]]
[[S51:reus_donation__tip_up]]

# How to globally set the tip-up checkbox as checked

  • Log into Luminate Online.
  • Turn off the WYSIWYG globally.
    • Log into Luminate.
    • Click on your name in the top right corner.
    • Uncheck Use the WYSIWYG checkbox.
    • Scroll to the bottom and click Save.
  • Go to Content > PageBuilder.
  • Search for reus_donation__tip_up.
  • Click on Manage and Copy Version to create a new copy of the page.
  • On line 7 of the code insert the following code snippet, this will set the box to be globally checked by default. [[?x[[S80:donationTipUpChecked]]x::xx::[[U0:donationTipUpChecked=true]]::]]. An example of how the final start of the page will be:
[[?Comment::neverdisplays::
<!--
  Global donation tip-up percentage, must be set here so it is set in the Donation app
  on the first page load only if it wasn't already defined.
-->
::]]
[[?x[[S80:donationTipUpChecked]]x::xx::[[U0:donationTipUpChecked=true]]::]]
[[?x[[S334:tip-up-checked]]x::xtruex::[[U0:donationTipUpChecked=true]]::[[?x[[S334:tip-up-checked]]x::xfalsex::[[U0:donationTipUpChecked=false]]::]]]]
<div class="tip-up [[?xfalsex::x[[S334:tip-up]]x::hidden::]]" id="tip-up">
  • On line 14 of the code the default perfecentage is set, in this case it's 2.2
[[?x[[S80:donationTipUpPercentage]]x::xx::
  <span class="tip-up__amount" id="tip-up__amount" data-tip-up-percentage="2.2"></span>.
::
  <span class="tip-up__amount" id="tip-up__amount" data-tip-up-percentage="[[S80:donationTipUpPercentage]]"></span>.
]]

# How to temporarily set the tip-up checkbox as checked or unchecked

To set the tip-up checkbox to be checked or unchecked on the donation form for the Target experiments add a URL parameter tip-up-checked=true or tip-up-checked=false to the URL of the donation form.

If the donation form by default has the checkbox checked then you will just need to add tip-up-checked=false to test the unchecked state. Likewise, if the donation form does not have a box prechecked then adding tip-up-checked=true to the URL will create the alternative test case.

Note that the tip-up must be present and shown on the form by default for this to work.

Example: https://lo-test.savethechildren.org/site/Donation2?df_id=1620&mfc_pref=T&1620.donation=form1&tip-up-checked=true.

# How to change the tip-up percentage

  • The default site-wide percentage is set with a session variable donationTipUpPercentage in PageBuilder page reus_head_1561.
  • To change the percentage for an individual form, edit the HTML Caption element of the form that holds the tip-up code.
  • Insert the following code into the field before the tip-up code, changing the number to reflect the new percentage amount, in this example 3. [[U0:donationTipUpPercentage=3]]
    The final code in the field will be:
[[U0:donationTipUpPercentage=3]]
[[S51:reus_donation__tip_up]]

# How to globally change the tip-up percentage

  • Log into Luminate Online.
  • Turn off the WYSIWYG globally.
    • Log into Luminate.
    • Click on your name in the top right corner.
    • Uncheck Use the WYSIWYG checkbox.
    • Scroll to the bottom and click Save.
  • Go to Content > PageBuilder.
  • Search for reus_donation__tip_up.
  • Click on Manage and Copy Version to create a new copy of the page.
  • On line 14 of the code change the value 2.2 in the expression <span class="tip-up__amount" id="tip-up__amount" data-tip-up-percentage="2.2"></span>. to a new percentage. Be careful not to change any other HTML code or bracket code. Note the value just contains number for the computed percentage. An example the change to 3.75%:
[[?x[[S80:donationTipUpPercentage]]x::xx::
  <span class="tip-up__amount" id="tip-up__amount" data-tip-up-percentage="3.75"></span>.
::
  <span class="tip-up__amount" id="tip-up__amount" data-tip-up-percentage="[[S80:donationTipUpPercentage]]"></span>.
]]

# How to set the checkbox as checked and customize the percentage

If you want to have the box be prechecked and the percentage customized, just combine the code snipets from instructions above.
The final code in HTML caption field will be:

[[U0:donationTipUpChecked=true]]
[[U0:donationTipUpPercentage=3]]
[[S51:reus_donation__tip_up]]

# How to temporarily disable the tip-up on the donation form

To disable the rendering of the tip-up on the page for the Target experiments add a URL parameter tip-up=false to the URL of the donation form.

Note that the tip-up must be present on the form by default.

Example: https://lo-test.savethechildren.org/site/Donation2?df_id=1620&mfc_pref=T&1620.donation=form1&tip-up=false.

# How to update the tip-up text

  • Log into Luminate Online.
  • Turn off the WYSIWYG globally.
    • Log into Luminate.
    • Click on your name in the top right corner.
    • Uncheck Use the WYSIWYG checkbox.
    • Scroll to the bottom and click Save.
  • Go to Content > PageBuilder.
  • Search for reus_donation__tip_up.
  • Click on Manage and Copy Version to create a new copy of the page.
  • Edit the HTML content of the page without editing the bracketed code or changing the id attributes on the elements.
  • Publish the new version of the page.

← Designation configuration →