Plant-for-the-Planet Widgets are **Web components** powered by Svelte Framework**.**
Web Components are a set of web platform APIs that allow you to create new custom, reusable, encapsulated HTML tags to use in web pages and web apps. The goal of a widget is to allow users and organizations to use our components in their own websites with minimum dependencies.
Open Source Repository « Report a bug » View Widget Examples
Table of Contents
The Tree Profile Widget is a basic widget that allows you to showcase your planting progress.
<script defer src="<https://widgets.plant-for-the-planet.org/build/tree-profile.js>"></script>
<tree-profile user="prf_h6smcMDN23Qet1CP7BEplM60" theme="light" primarycolor="#68b030" circlebgcolor="#23519b" community="true" locale="de"></tree-profile>
<aside>
🔥 You can get the ID of the user by visiting : https://app.plant-for-the-planet.org/app/profiles/{slug or username} User ID begins with prf_ eg: prf_h6smcMDN23Qet1CP7BEplM60
</aside>
The Tree Map Widget is an extended profile widget that allows you to showcase your planting progress displaying a map of your tree contributions (donations, gifts, or registrations).
<script defer src="<https://widgets.plant-for-the-planet.org/build/tree-map.js>"></script>
<tree-map user="prf_h6smcMDN23Qet1CP7BEplM60" theme="light" community="true" locale="de"></tree-map>
<aside>
💡 Note: Both, the Tree Map Widget and the Tree Profile Widget supports display of the Plant-for-the-Planet Logo if users have signed logo agreement with us. Please contact Backend team to update logo license for approved partners.
</aside>