Install the cancel button
Donors use this button on your website to change or cancel their gift. It opens a Roster pop-up, like your giving button. Nobody at the church has to be in the middle.
A church that signed up with Roster directly starts receiving gifts only after this button has been seen on its website (see Start receiving gifts). It counts on an address saved in the dashboard: if you remove that address, new donors wait until the button loads on one you kept. Keep it there: without it, donors can't find where to change their gift. A church registered by a giving platform does not need it: its donors reach the change-or-cancel page from the link in our emails, or from the platform's own account area.
Put it where donors look for their giving: your site footer, your Give page or your members area. Its text is the same for every church, so donors always recognize it, and it uses the colors and corners of your giving button.
Paste the code
Save your website in the dashboard first (Integration Guide, step 2, or Your website on Donor Flow): the button only works on the addresses saved there. Then copy the code from Integration Guide, step 3, or from Cancellation. It carries your church's ID; the code below is only its shape.
<div data-roster-church="ch_…" data-roster-surface="manage"></div>
<script src="https://flow.rostergiving.com/v1/roster.js" async></script>
Already have our script on that page? Paste only the first line: one script serves both buttons.
Use your own button
The Cancellation page has both ways with your ID filled in.
-
Add an attribute. If you can edit your button's code, add
data-roster-openwith your church's ID anddata-roster-surface="manage", and paste the script on the same page:<button type="button" data-roster-open="ch_…" data-roster-surface="manage">Change or cancel my gift</button> <script src="https://flow.rostergiving.com/v1/roster.js" data-roster-church="ch_…" async></script> -
Point a link. If you can only set a link, paste the script on the page and point your button to
#roster-manage:<script src="https://flow.rostergiving.com/v1/roster.js" data-roster-church="ch_…" async></script> <a href="#roster-manage">Change or cancel my gift</a>
Your giving button is on the same page? Keep one script. If either button is a
link, that script carries data-roster-church, as above.
Check that it works
Open the page where you pasted the code. As soon as the button loads on your website, Detection on Cancellation reads Cancel button on your site, with the date and the page where it was last seen. In the Integration Guide, step 3 reads On your site, and Cancel button detected is checked under To start receiving gifts. Check now looks again.
If we haven't heard from your cancel button for 3 days or more, the dashboard reads No signal from your cancel button and asks you to check that it's still on your website, the Overview lists it under Needs you, and we email the church. Put it back: donors rely on it.
