Donation thermometer

Site URL: https://ridefortheliving.org

Hi,

we are a nonprofit thinking of ways to perfect our yearly campaign. We would like to have a donation thermometer on the webiste, but we don't have experience with coding. For this campaign, we collect donations through Kindful and we do have a donation thermometer on the crowdfunding page (example: https://jcckrakow.kindful.com/ride-for-the-living-2020). It would be great if the thermometer on the website could be linked with Kindful so that it would update automatically, but we could also update the numbers manually if that would be impossible.

Does anyone have any ideas, suggestions on how to make this work? I would really appreciate any insight 🙂

Thank you so much!

On 12/16/2020 at 8:08 PM, JudytaK said:

Site URL: https://ridefortheliving.org

Hi,

we are a nonprofit thinking of ways to perfect our yearly campaign. We would like to have a donation thermometer on the webiste, but we don't have experience with coding. For this campaign, we collect donations through Kindful and we do have a donation thermometer on the crowdfunding page (example: https://jcckrakow.kindful.com/ride-for-the-living-2020). It would be great if the thermometer on the website could be linked with Kindful so that it would update automatically, but we could also update the numbers manually if that would be impossible.

Does anyone have any ideas, suggestions on how to make this work? I would really appreciate any insight 🙂

Thank you so much!

To connect live data, you may need to ask a javascript developer to connect with the api of kindful.

In the meantime, let's have a look at this pure css solution like so

CSS Donation Thermometer (codepen.io)

Hi @Bangank36

I was trying to built in the code you recommended but my preview shows this: 

Where is the thermometer? What am I doing wrong? Thanks!