# Donation Premiums

Donation support premiums, however additional code has been written to customize the premium functionality.

# Recurring payments

The code has been customized to show the premiums only for the recurring payment types. When a user changes their gift to one-time, scripts will hide the premium selector and set the default value to No Premium.

# Image Replacement

Premium image replacement has been added 2024-05. To replace images for the premiums:

  • Edit reus_content_catalog PageBuilder page
  • Locate premiumImages JavaScript variable
  • Update the JSON object, the pattern is id: 'url' where id is the id of the premium and url is the image URL, preferrably with a Cloudfront CDN domain.

Simple example:

<script>
  var premiumImages = {
    1361: 'https://dx2eq2oh924g4.cloudfront.net/images/content/pagebuilder/tote-alt.jpg'
  };
</script>

Full example with conditionals for live and test enviornments:

  <script>
  [[?Xsupport.savethechildren.orgX::X[[S29:DOMAIN]]X::
    var premiumImages = {
      1461: 'https://d290h2g0ajcvb3.cloudfront.net/images/content/pagebuilder/tote-alt.jpg'
    };
    ::
    var premiumImages = {
      1361: 'https://dx2eq2oh924g4.cloudfront.net/images/content/pagebuilder/tote-alt.jpg'
    };
  ]]
  </script>

# Default Selection

Code has been added 2024-05 to allow the premiums to be selected by default on page load (or donation amount change). If there are multiple premiums the code will select the first one in the list.

To add the default selection:

  • Edit reus_content_catalog PageBuilder page
  • Locate <script type="text/template" id="donation-premium-select"> JavaScript variable
  • Update the array to include a list of donation form ids where the first premium has to be selected by scripts as default value.

Full example with conditionals for live and test enviornments:

<script type="text/template" id="donation-premium-select">
  [[?Xsupport.savethechildren.orgX::X[[S29:DOMAIN]]X::
    [11846]
  ::
    [2664]
  ]]
</script>