§ 01 — Fundraising

Donation experiences for fundraising pages.

Fundraising embeds are self-contained donation experiences for campaign pages, editorial pages, and seasonal giving. They are separate from Checkout: you embed the experience you need, and Octany handles the donation interaction behind it.

Public naming Use Fundraising for the category and Donation, 1-click Swish, and Greeting for the public experiences. Avoid calling these widgets in public copy.

§ 01.1 Experiences #

Experience	Use it for	Loader path	Container class
Donation	Modern donation flows for one-off and recurring gifts.	`donate`	`.octany-donate`
1-click Swish	Fast Swish-first giving where the donor chooses an amount and continues in Swish.	`swish-v1`	`.octany-swish-widget`
Greeting	Donation with a greeting card, tribute, or seasonal message, such as Mother's Day.	`greeting-v1`	`.octany-greeting-widget`

§ 01.2 Embed snippet #

Each fundraising experience uses the same shape: a container element and a loader script. The api, widget, and optional lang query parameters identify the configuration and language.

1-click Swish

<div class="octany-swish-widget"></div>
<script
  type="module"
  src="https://give.octany.com/swish-v1/loader.js?api=https://api.octany.com/widgets&widget={widget-id}&lang=sv"
></script>

Donation

<div class="octany-donate"></div>
<script
  type="module"
  src="https://give.octany.com/donate/loader.js?api=https://api.octany.com/widgets&widget={widget-id}&lang=sv"
></script>

Greeting

<div class="octany-greeting-widget"></div>
<script
  type="module"
  src="https://give.octany.com/greeting-v1/loader.js?api=https://api.octany.com/widgets&widget={widget-id}&lang=sv"
></script>

§ 01.3 Theming #

Theming uses CSS custom properties on the host page.

:root {
  --octany-primary: #c8102e;
  --octany-radius: 8px;
}

Your Octany contact can provide the available variables for the fundraising experience you are using.

§ 01.4 When to use Fundraising vs Checkout #

Use Fundraising when the public page itself is the donation experience.
Use Checkout when your app or site needs a hosted checkout URL, cart, or JS checkout API.
Use Classic widget only when maintaining an existing classic integration.

← Overview Next: Checkout →