> For the complete documentation index, see [llms.txt](https://docs.changeup.com/salesforce/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.changeup.com/salesforce/salesforce-b2c-commerce/setup-and-configuration/site-preferences/product-page-donations.md).
# Product Page Donations
### Percentage Options
These options are required to set the amounts of the percentage options on the dashboard. This preference has default values: 1, 2, 2.5, 3, 5, 10
1. Navigate to **Merchant Tools > Site Preferences > Custom Preferences > ChangeUp**
2. Enter the values separated by commas and order from least to greatest or leave the field empty to use the default values (the field next to **ChangeUp - Percentage Options Product Page Donations**).
3. Click **Save**.
Percentage options for the Product Page Donations.
### Donation Amount for Product Detail Page (PDP)
```javascript
'use strict';
module.exports = function () {
var sales = $('.salesuplift-donation').length || $('.salesuplift-donation-nogrid').length ? true : false;
if (sales){
var percentage = document.getElementById('percentage').innerText;
var productValue = '';
var value = '';
var productPrice = '';
var su_donation = '';
var quantitycount = '';
var quantity = '';
var products = document.getElementsByClassName('su_donation').length;
setInterval(function setPrice() {
for (let i = 0; i < products; i++) {
productValue = $('.strike-through').length ? $('span.value')[i+1] : $('span.value')[i];
value = productValue.innerText;
productPrice = value.split('$')[1];
quantitycount = '#quantity-' + (i+1);
quantity = $(quantitycount)[0].selectedIndex + 1;
su_donation = (parseFloat(productPrice.replace(',', '')) * parseFloat((percentage/100)));
document.getElementsByClassName('su_donation')[i].innerHTML = '$' + (su_donation.toString().match(/^-?\d+(?:\.\d{0,3})?/)[0] * quantity).toFixed(2);
document.getElementsByClassName('su_donation_modal')[i].innerHTML = '$' + (su_donation.toString().match(/^-?\d+(?:\.\d{0,3})?/)[0] * quantity).toFixed(2);
}
},1000);
};
};ja
```
To obtain this value inside PDP, we use the name of the class where the price of the product is found:
| var ***percentage*** = represents the percentage of the donation (2%), this value is defined from the dashboard |  |
| -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | -------------------------------- |
| var ***productValue*** = This represents the price of the product in the PDP, this value is necessary to calculate the donation. To obtain; we used the class name ‘strike-through’ to check if the price has a discount; as shown in this example |  |
| If the product has this format, we will use the second value to calculate the donation using the class name ‘span.value’\[1]. In another way, use ‘span.value’\[0] |  |
| Span.value\[i]: This value corresponds to the product’s price, this selector can be modified by the name of the container and class where the value of the product is located |  |
| ‘#quantity-‘ = this value represents the id name for the quantity selector, this name can be replaced for the id name of the quantity selector in the PDP |  |
|
‘#quantity-‘ + \[i+1] = the "\[i+1]" is added in the case of having more
than one product in the PDP.
| **Sets Products** |
| var ***quantity*** = this variable contains the number of the quantity selector in the PDP, It is used for calculating the donation using the productPrice and percentage |  |