Skip to main content

Crisis Resources Widget

Embeddable crisis helplines for any platform. 222 countries, 93 service scopes.

Widget Guide & Documentation

Configuration

Service Scopes

WHAT the resource helps with

All 93 scopes

Populations

WHO the resource serves

All 23 populations

Options

Live Preview

Loading preview...

Event Log

Events from the widget will appear here
Widget URL
https://widget.nope.net/resources?country=US&theme=light&scopes=suicide%2Ccrisis

Embed Code

<iframe
  src="https://widget.nope.net/resources?country=US&theme=light&scopes=suicide%2Ccrisis"
  width="100%"
  height="400"
  frameborder="0"
  title="Crisis Resources"
></iframe>

Choose iframe for simplicity, JavaScript API for event handling, or React for Next.js apps. See the Widget Guide for advanced integration patterns.

URL Parameters

ParameterTypeDefaultDescription
countrystringUSISO country code or "auto" for IP detection
themestringlight"light" or "dark"
scopesstring-Service scopes - WHAT the resource helps with (e.g., suicide, domestic_violence)
populationsstring-Populations - WHO the resource serves (e.g., veterans, lgbtq, youth)
pickerbooleantrueShow/hide the country picker dropdown
dismissiblebooleanfalseShow close button allowing user to dismiss
limitnumber10Maximum number of resources to display

PostMessage API

The widget emits events via window.postMessage. All events include source: 'nope-widget' for filtering.

ready

Widget has loaded and is ready

{ source, type }
dismiss

User clicked the dismiss button (if dismissible)

{ source, type }
resourceClick

User clicked on a resource

{ source, type, resource: { name, phone?, url?, ... } }
Example listener
window.addEventListener('message', (event) => {
  if (event.data?.source !== 'nope-widget') return;

  switch (event.data.type) {
    case 'ready':
      console.log('Widget loaded');
      break;
    case 'resourceClick':
      console.log('Clicked:', event.data.resource.name);
      break;
    case 'dismiss':
      console.log('Widget dismissed');
      break;
  }
});