Elements

Elements is a fundraising-specific UI kit developed by Fundraise Up. It consists of more than 20 components, including as buttons, inputs, and sliders, that can be easily implemented on your organization’s website.

Using Elements on your website engages supporters as they browse your site content, and increases conversion. For Elements such as Recent Donations and Goal Meter, donations usually appear on the Element after around 30 seconds (though this can take up to 1 minute), allowing supporters to monitor your campaign’s progress in near-real-time and see their contribution reflected.

Elements are created and managed from the Elements tab in the Fundraise Up Dashboard. Each Element you create is associated with one of your campaigns.

Types of components

There are six types of Element:

• Buttons: Donate Button, Sticky Button, Image Card, Button Group, P2P Button
• Data: Goal Meter, Stat Counter, Donor Map
• Forms: Donation Form, Simple Form, Impact Slider, Donation Levels
• Links: Donate Link, QR Code, P2P Link
• Lists: Top Supporters, Recent Donations, Top Fundraisers, Top Elements
• Overlays: Reminder, Message Bar, Social Proof, Popup

To create any of these elements, go to the Elements tab in the Dashboard and click New Element.

Opening behavior

If both the Campaign Page and the Checkout modal are enabled for a campaign, Elements connected to that campaign may open either of the two formats, as per the following rules:

Installation

As a best practice, we recommend that you use Elements once the Fundraise Up installation code has already been added to your website.

Overlay components, such as Reminder and Popup, as well as the Sticky Button can then be used without additional configuration. This is because overlay-style components are not placed within the layout of your website, but are instead overlayed over page contents at the highest visual layer (z-index) of your site. When creating the Element, simply enter the URLs where you want the Element to appear (or not appear).

Other components are added to your website using code snippets, which need to be added to your website using a content management system (CMS) or code editor.

1<a href="#XTGWFZFR" style="display: none"></a>

No-code Elements

Some Elements components do not require the Fundraise Up installation code to render and can be implemented outside of your website.

The following are no-code components:

• Donate Link
• P2P Link
• QR Code

When created in the Fundraise Up Dashboard, Donate Link and P2P Link components generate tracked links. These links can be used for email campaigns, social media posts, and assets in other channels. The QR Code component enables you to generate a downloadable PNG image file of the generated code that can be added to offline channels, like direct mail packages.

1https://donate.ropsi.org/-/XWZBZUBB

Customization

Elements are customized from the Elements tab within the Fundraise Up Dashboard.

When a new component is created, you can configure its behavior, appearance, and other characteristics. These configurations can be modified at any time by accessing that component from the Elements tab.

There are five common configuration areas for Elements:

• Behavior: these settings dictate which campaign the component is associated with, and how the selected campaign’s Checkout form should appear when it’s launched from an Element. You can use Match checkout settings in these instances if you want to keep the same settings as in that campaign. The exact set of behavior-related settings depends on the specific Element you’re creating/editing.
• Appearance: these settings provide controls for appearance customizations such as sizing, colors and borders. Configuring appearance settings helps you customize Elements to match the appearance of your existing website.
• Custom fields: if custom fields have been added to the associated campaign, they appear as a customization option for many Elements components. This enables you to set field values that are specific to multiple components associated with the same Campaign.
• URL control/Visibility: specific to the overlay Elements and the Sticky Button, these settings let you choose on which exact pages Elements should appear. Find more detailed configuration instructions in the Overlays section.
• Localization: the labels for all Elements components can be localized. When Localization is enabled in your main settings, a Localization option will be displayed, which shows the translations you can enable for that component. When a second language is enabled, an input will appear that allows you to add customized labels in other languages.

Customization options vary for each component. To view the specific options available for a certain component, create a test version of that component in the Elements tab in the Fundraise Up Dashboard.

Conversion tracking

You can track the conversion of each Element you create in the Statistics column in the Elements tab view. There are three conversion funnel metrics:

• Component views: the number of website visitors who viewed the component (the component was visible in the viewport)
• Checkout views: the number of website visitors who interacted with the component and then viewed its associated Checkout modal or Campaign Page.
• Donations: the number of website visitors whose donation originated from interacting with that Element.
  When viewing conversion statistics for P2P fundraisers, the number of fundraisers created is counted in place of number of donations made.

Real-time updates

One of the benefits of using Elements on your website is that the components you implement can be updated from the Fundraise Up Dashboard.

When changes to a component are made in the Fundraise Up Dashboard, the changes are automatically propagated to your website. This can take up to a few minutes.

This reduces dependency on your organization’s web developers to make changes to the appearance and behavior of your Elements, and gives marketing and fundraising teams increased flexibility and control over site content.

Adding offline donations

When creating and editing a Stat Counter or Goal Meter, you will see the option to Add amount. This allows you to add donations that were not made through Fundraise Up towards your total — cash donations made in person, for example. You can also add your offline donations in the Offline section of your campaign settings. Any Stat Counter or Goal Meter Elements linked to that campaign will then also include the donations you added in Offline.

Localization

Our Elements are fully localizable, allowing your organization to create Elements in your supporters’ preferred languages. You can also fully customize the texts and labels shown in each language. Explore our Localization guide to learn more.

Checkout compatibility

Some Elements can only be used when particular payment methods are enabled for the campaign associated with that Element: