How to Put Your Booking Widget on Your Website

Complete guide to integrating the EMRG Booking Widget into any website, including special instructions for users transitioning from BLVD.

Quick Setup Option

If you're okay with just having your book buttons open up your EMRG booking page in a new tab, simply use this URL for your buttons:

https://joinemrg.com/book?clinicId=YOUR_CLINIC_ID

Replace YOUR_CLINIC_ID with your actual clinic ID provided by your EMRG Success Specialist.

Otherwise, follow the guide below to add the interactive widget overlay to your website.

Choose Your Integration Method

We offer two integration approaches depending on your needs:

Method 1: Modern Click-Based Integration (Recommended) — Best for new installations or when you want full control over button placement and styling.
Method 2: Hash-Based Integration (BLVD Migration) — Perfect for users transitioning from BLVD, as it works with existing #book-now button links.

Method 1: Modern Click-Based Integration

Step 1: Add Widget Script to Your Website

Add this code to your website's HTML <head> section or footer:

<!-- EMRG Widget Integration -->
<script>
  (function (d) {
    var config = {
      clinicId: YOUR_CLINIC_ID, // Replace with your clinic ID
      gaMeasurementId: "G-XXXXXXXXXX", // Optional: Replace with your Google Analytics ID
      metaPixelId: "XXXXXXXXXXXXXXXX", // Optional: Replace with your Meta Pixel ID
    };

    var script = d.createElement("script");
    var firstScript = d.querySelector("script");

    script.src = "https://joinemrg.com/widget.js";
    script.async = true;
    script.defer = true;
    script.onload = function () {
      if (window.emrgWidget) {
        window.emrgWidget.init(config);
      }
    };

    firstScript.parentNode.insertBefore(script, firstScript);
  })(document);
</script>
<!-- End EMRG Widget -->

Step 2: Add Booking Buttons

Create buttons anywhere on your website using this code:

<div onclick="window.launchEmrgWidget && window.launchEmrgWidget(YOUR_CLINIC_ID)" class="btn">
  Book an Appointment
</div>

The widget will open in a modal when the button is clicked.

You can also use regular HTML buttons:

<button onclick="window.launchEmrgWidget && window.launchEmrgWidget(YOUR_CLINIC_ID)" class="booking-btn">
  Schedule Now
</button>

Or integrate with existing JavaScript:

// For custom event handling
function openBookingWidget() {
  if (window.launchEmrgWidget) {
    window.launchEmrgWidget(YOUR_CLINIC_ID);
  }
}

Method 2: Hash-Based Integration (BLVD Migration)

Perfect for BLVD users: If you're switching from BLVD, your existing buttons already use #book-now links, so this method will make them work with EMRG automatically.

Step 1: Add Widget Script with Hash Handling

Add this code to your website's HTML <head> section or footer:

<!-- EMRG Widget Integration with Hash Support -->
<script id="widget-injector" src="https://joinemrg.com/widget.js" async defer></script>
<script>
// Initialize widget after page loads
window.addEventListener('load', function() {
  if (window.emrgWidget) {
    window.emrgWidget.init({
      clinicId: YOUR_CLINIC_ID,
      gaMeasurementId: 'G-XXXXXXXXXX' // Optional: Your Google Analytics ID
    });
  }
  
  // Check if page loaded with #book-now hash
  if (window.location.hash === '#book-now') {
    // Small delay to ensure widget is ready
    setTimeout(function() {
      if (window.launchEmrgWidget) {
        window.launchEmrgWidget(YOUR_CLINIC_ID);
      }
    }, 250);
  }
});

// Listen for hash changes (when someone clicks a #book-now link)
window.addEventListener('hashchange', function() {
  if (window.location.hash === '#book-now') {
    if (window.launchEmrgWidget) {
      window.launchEmrgWidget(YOUR_CLINIC_ID);
    }
    // Clean up URL after opening widget
    history.replaceState(null, null, window.location.pathname);
  }
});
</script>
<!-- End EMRG Widget -->

Step 2: Use #book-now Links

Your existing buttons should already work if they use #book-now links:

<a href="#book-now" class="btn">Book Appointment</a>
<button onclick="window.location.hash='book-now'">Schedule Now</button>

Affiliate Widget Support

The EMRG Affiliate Program lets you grow your patient base through influencer and referral partnerships — with full revenue tracking built into your analytics dashboard. If you haven't set up your affiliate codes yet, start there first. Once your codes are ready, use the options below to connect them to your website's booking widget so patients arrive with the right offer already applied.

There are two ways to do this. Use whichever fits your setup.

Option A: Dedicated Affiliate Pages

If you have a landing page for a specific affiliate (e.g. yoursite.com/thundrbro/), add the affiliateCode to your widget config on that page:

<!-- EMRG Widget Integration — Affiliate Page -->
<script>
  (function (d) {
    var config = {
      clinicId: YOUR_CLINIC_ID,
      affiliateCode: "AFFILIATE_CODE_HERE", // Affiliate's unique code
      gaMeasurementId: "G-XXXXXXXXXX", // Optional
      metaPixelId: "XXXXXXXXXXXXXXXX", // Optional
    };

    var script = d.createElement("script");
    var firstScript = d.querySelector("script");

    script.src = "https://joinemrg.com/widget.js";
    script.async = true;
    script.defer = true;
    script.onload = function () {
      if (window.emrgWidget) {
        window.emrgWidget.init(config);
      }
    };

    firstScript.parentNode.insertBefore(script, firstScript);
  })(document);
</script>
<!-- End EMRG Widget -->

Your standard pages (without affiliateCode) continue to work normally — only pages with the code will link patients to that affiliate.

Think of it like setting up a dedicated landing page for an influencer — anyone who visits that page is automatically connected to their offer, no extra steps required.

Option B: URL Parameter (Zero Code Changes)

If you don't want to create separate pages or change any code, affiliates can simply share links with ?affiliateCode= appended to any page that already has the widget installed:

https://yoursite.com/?affiliateCode=AFFILIATE_CODE_HERE
https://yoursite.com/services/?affiliateCode=AFFILIATE_CODE_HERE

The widget automatically picks up the affiliateCode from the URL and passes it through to the booking flow. No config changes needed on your end.

This is great for social media links, email campaigns, or anywhere affiliates share their personal booking link.

Think of it like an influencer posting their affiliate link on Instagram — when a patient taps it and books, the code rides along automatically. Nothing changes on your end.

Quick Setup Option (Affiliate)

If you prefer the simple new-tab approach instead of the widget overlay, affiliates can share a direct booking link:

https://joinemrg.com/book?clinicId=YOUR_CLINIC_ID&affiliateCode=AFFILIATE_CODE_HERE

WordPress Integration

Using a Plugin (Recommended)

Install a Header/Footer Plugin

Go to Plugins → Add New
Search for "Insert Headers and Footers" or "WP Headers and Footers"
Install and activate

Add the Widget Code

Go to Settings → Insert Headers and Footers (or similar)
Paste your chosen method's code in the Footer section
Save changes

Manual Integration

Add the widget code to your theme's footer.php file before the closing </body> tag, or in your theme's functions.php using:

function add_emrg_widget() {
    // Paste your chosen widget code here
}
add_action('wp_footer', 'add_emrg_widget');

Configuration Options

Required Settings

Setting	Description
`clinicId`	Your unique EMRG clinic ID (provided by your Success Specialist)

Optional Settings

Setting	Description
`gaMeasurementId`	Your Google Analytics 4 Measurement ID for tracking widget interactions
`metaPixelId`	Your Meta Pixel ID for Facebook/Instagram tracking
`affiliateCode`	An affiliate's unique code — only use on affiliate-specific pages

Remove the gaMeasurementId, metaPixelId, and affiliateCode lines entirely if you don't use them.

Finding Your Clinic ID

Your clinic ID is provided by your EMRG Success Specialist. It's usually a number like 16 or 17. Make sure to replace YOUR_CLINIC_ID in all code examples with your actual ID.

Widget Functionality

Once integrated, the EMRG widget provides:

Seamless booking experience directly on your website
Mobile-responsive design that works on all devices
Patient form completion and intake management
Appointment scheduling with real-time availability
Integration with your EMRG system for automatic data sync
Automatic affiliate tracking and discount offer linking (when configured)

Troubleshooting

Widget Not Appearing

Check the script is loading

Open browser developer tools (F12)
Go to Network tab and refresh page
Look for widget.js in the loaded files

Verify your clinic ID

Ensure you've replaced YOUR_CLINIC_ID with your actual number
Double-check the ID with your Success Specialist

Check for JavaScript errors

Open browser developer tools (F12)
Look for red errors in the Console tab

Buttons Not Working

Confirm button code is correct

Make sure onclick handlers include your clinic ID
For hash method, ensure links use #book-now

Check timing issues

The widget script needs to load before buttons are clicked
Try adding a small delay or using the load event

BLVD Migration Issues

Remove old BLVD code

Delete any remaining BLVD widget scripts
Keep your existing #book-now button links

Test all pages

Check that buttons work consistently across your site
Verify the widget opens with your EMRG branding

Affiliate Code Not Working

Verify the code is correct

Affiliate codes are case-sensitive — confirm the exact code with your EMRG Success Specialist
Check that the code is active in your EMRG dashboard

Check which method you're using

If using Option A (config), make sure affiliateCode is in the init() call on the correct page
If using Option B (URL param), make sure the URL has ?affiliateCode=EXACTCODE

Test it

Open the widget and complete a test booking
Confirm the patient shows the affiliate as their referral source in the EMRG dashboard

Google Analytics Not Tracking

Verify your Measurement ID

Ensure you're using the correct GA4 ID format: G-XXXXXXXXXX
Check that GA4 is properly configured on your site

Test tracking

Use GA4's Real-Time reports to see widget events
Events should appear when the widget opens

Meta Pixel Not Tracking

Verify your Pixel ID

Ensure you're using the correct Meta Pixel ID format: XXXXXXXXXXXXXXXX
Check that Meta Pixel is properly configured on your site

Test tracking

Use Meta Events Manager to see widget events
Events should appear when the widget opens

Support

For additional help with widget integration or troubleshooting:

Email: support@joinemrg.com
Contact your EMRG Success Specialist
Check our knowledge base for additional articles

The EMRG team is here to ensure a smooth integration process for your website.