Embeddable Referral Widget

The embeddable widget lets you add a referral signup form directly to your own website. Visitors can join your referral program without being redirected to a separate page.

What the Widget Does

The widget renders a branded signup form on any page of your website. When someone fills it out, they're registered as an affiliate in your ViralRef program and receive their referral link immediately.

The form collects the same information as your standard join page:

• Name
• Phone number
• Email address

After signup, the new affiliate sees a confirmation with their unique referral link and can start sharing right away.

Getting the Embed Code

1. Go to Settings > Organization > Developers
2. Find the Widget Configuration section
3. Copy the embed code

The embed code is a small snippet of HTML that you paste into your website.

Adding the Widget to Your Site

Option 1: Iframe Embed

The simplest approach. Paste the iframe code into any HTML page:

<iframe
  src="https://your-subdomain.viralref.com/join"
  width="100%"
  height="600"
  frameborder="0"
  style="border: none; max-width: 500px;"
></iframe>

This works on any website — WordPress, Squarespace, Wix, custom HTML, or any platform that allows HTML embeds.

Option 2: Script Tag

For more control over styling and behavior, use the script tag embed:

<div id="viralref-widget"></div>
<script src="https://your-subdomain.viralref.com/widget.js"></script>

The script tag version loads the form inline and adapts to your page's width.

What Visitors See

The widget displays a clean signup form with:

• Your organization's name and branding
• Input fields for name, phone, and email
• A clear call-to-action to join the referral program
• Your program's reward details (so visitors know what they'll earn)

After signing up, visitors see their referral link with a copy button and sharing options.

Customization

The widget automatically picks up your program's branding:

• Organization name appears in the header
• Program logo is displayed if you've uploaded one
• Reward details are pulled from your program configuration
• Colors and styling match your portal branding settings

Configure branding from Programs > Edit Program > Portal Branding.

Where to Use the Widget

Business Website

Add the widget to a "Refer a Friend" page on your main website. Link to it from your navigation, footer, or post-purchase confirmation page.

Booking Page

If you use an online booking system, add the widget to your booking confirmation page. Customers who just booked are a prime audience for your referral program.

Email Signatures and Newsletters

Link to the page containing your widget from email signatures, newsletters, or post-visit follow-up emails.

Social Media Bio Links

Add a link to your referral widget page in your Instagram, TikTok, or Facebook bio.

Tips for Higher Signup Rates

• Place the widget where customers are already engaged. Post-purchase and post-visit pages convert better than a random landing page.
• Lead with the reward. Make the incentive clear before the form — "Refer a friend, you both get $25."
• Keep the surrounding page simple. Don't bury the widget below a wall of text.
• Test it on mobile. Most of your customers will see it on their phone.

Troubleshooting

Widget Not Loading

• Make sure the embed code matches your current organization subdomain
• Check that your site allows iframes from external domains (some website builders block them by default)
• Verify the widget URL loads when opened directly in a browser

Form Not Submitting

• The widget requires HTTPS on both your site and the ViralRef domain
• Check browser console for any content security policy (CSP) errors
• Make sure you haven't accidentally modified the embed code

Next Steps