Embed

Put the MSY calculator on any web page.

A free embeddable widget from America Learns. Zero dependencies. Works in React, Wix, Squarespace, WordPress, plain HTML — anywhere you can paste a <script> tag.

Live preview

01

Script tag (recommended)

Drop a target div and call MSYWidget.mount().

<div id="msy-widget"></div>
<script src="https://americorpsmsy.americalearns.com/msy-widget.js"></script>
<script>MSYWidget.mount('#msy-widget');</script>
02

Auto-mount

Any element with data-msy-widget mounts automatically.

<div data-msy-widget></div>
<script src="https://americorpsmsy.americalearns.com/msy-widget.js" defer></script>
03

Iframe

For sandboxed editors like Notion, Confluence, or older CMSes.

<iframe
  src="https://americorpsmsy.americalearns.com/msy-widget.html"
  style="width:100%;max-width:720px;height:600px;border:0"
  title="AmeriCorps MSY Calculator by America Learns"
  loading="lazy"></iframe>
04

Programmatic API

Options, instance methods, and a pure calculation helper.

// Programmatic API
const widget = MSYWidget.mount('#msy-widget', {
  theme: 'light',           // 'light' | 'dark'
  decimals: 2,               // display precision
  showCopy: true,            // show Reset/Copy actions
  onChange: (total, state) => console.log('Total MSY:', total),
});

widget.getTotal();             // -> current total
widget.setVolunteers({ full_time: 5, half_time: 2 });
widget.destroy();

// Pure helper (no DOM)
MSYWidget.calculateMSY({ full_time: 5, half_time: 2 });

Hosting & terms

The widget is hosted free of charge by America Learns at americorpsmsy.americalearns.com. Please link back to americalearns.com when embedding.

Need more?

We build grant management, performance measures, and volunteers' time-tracking for 300+ AmeriCorps programs and 18 state service commissions.

Talk to America Learns →
← Back to the calculator