Skip to main content

RapidoReach JavaScript Widget Integration

Drop a single script tag on your page and the RapidoReach offerwall will render itself – no server work required.

What you need

  • Your RapidoReach App ID (available in the publisher dashboard).
  • A way to identify each user in your product (internal member ID, username, etc.).
  • A page section that is at least 320px wide and 600px tall.

3‑step setup

  1. Add a container where the offerwall should appear:
    <div id="rapidoreach-offerwall"></div>
  2. Paste the widget script right after the container. Replace the placeholders with your values and ensure you output the end-user ID dynamically.
    <script
    src="https://www.rapidoreach.com/ofw/rapidoreach-widget.min.js"
    data-app-id="YOUR_APP_ID"
    data-end-user-id="{{ CURRENT_USER_ID }}"
    data-container="#rapidoreach-offerwall"
    data-height="720px"
    data-loader-text="Finding surveys for you…"
    ></script>
  3. Deploy. That’s it — the widget calls RapidoReach, generates the signed UID for you, and loads the offerwall. Rewards and callbacks will reference the same user ID you passed in.

Tip: keep the container width fluid (e.g. width:100%) so the widget can scale to different devices.

Optional tweaks

Add or remove attributes on the script tag as needed.

AttributeWhat it does
data-width, data-height, data-min-heightControl iframe sizing (100%, 760px, etc.). Defaults: width:100%, height:700px, min-height:600px.
data-show-loaderSet to false to hide the default “Loading” message.
data-loader-text, data-loader-color, data-loader-backgroundCustomise the loader copy and colours.
data-border, data-border-radius, data-box-shadowAdd basic styling without writing CSS.
data-language, data-localeForward language/locale preferences (e.g. data-language="es").
data-param-*Appends extra query parameters (data-param-ref-code="sidebar"?refCode=sidebar).
data-user-idProvide a pre-generated RapidoReach UID instead of letting the widget build one. Rarely needed.

If you ever need to host the UID service yourself, set data-uid-endpoint to your own URL — otherwise ignore it and let RapidoReach handle the signature.

Behaviour notes

  • Automatic resizing: The iframe posts rapidoreach:resize events so the parent page always fits the offerwall content.
  • Analytics hooks: Listen for rapidoreach:ready, rapidoreach:load, or rapidoreach:error on the container if you want to trigger custom logic.
  • Single source of truth: The UID the widget generates is the same value returned in your callback, so you can credit the correct user immediately.

Need help? Email developers@rapidoreach.com with the URL of your integration and any console errors you see.