# Identify a Referrer

Here, we'll explore how to use the `RH_MFxxxxxxxxx.referrer` variable, a powerful tool for retrieving the referrer code associated with a user. By leveraging this variable, you can tailor your code to execute specific actions based on whether or not a user was referred to your site.

The `RH_MFxxxxxxxxxx.referrer` variable is a key component in tracking and utilizing referral codes in your website or application. By using this variable, you can detect whether a user has been referred by someone else and trigger specific actions based on that information. This section will guide you through the practical applications of `RH_MFxxxxxxxxxx.referrer`, how it works, and how you can implement it in your own code.

## What is the `RH_MFxxxxxxxxxx.referrer` Variable? <a href="#what-is-the-rh_mfxxxxxxxxxx.referrer-variable" id="what-is-the-rh_mfxxxxxxxxxx.referrer-variable"></a>

The `RH_MFxxxxxxxxx.referrer` variable stores the referrer code if it is available. This code can be found in the URL query string (e.g., `?mwr=xxxxxxxx`) or stored within a cookie named `__maitre-referrer-` in the user's browser. The referrer code typically represents a unique identifier associated with the person who referred the user to your site.

* **URL-Based Referrer Code**: When a user clicks on a referral link, the referrer code is appended to the URL, allowing your site to recognize the referral.
* **Cookie-Based Referrer Code**: If the user’s browser has the `__maitre-referrer-` cookie, it indicates that the user was referred previously, even if they navigate to your site later without the referral link in the URL.

The `RH_MFxxxxxxxxxx.referrer` variable does not require any specific method calls. Instead, it is automatically available in your code once the ReferralHero script is loaded on your site. When called, `RH_MFxxxxxxxxxx.referrer` will return the referrer code if it exists, or `undefined` if no referrer code is present.

## Implementing `RH_MFxxxxxxxxxx.referrer` in Your Code <a href="#implementing-rh_mfxxxxxxxxxx.referrer-in-your-code" id="implementing-rh_mfxxxxxxxxxx.referrer-in-your-code"></a>

Here’s a basic example of how you can implement the `RH_Mfxxxxxxxxxx.referrer` variable in your code:

Copy

```javascript
window.RHConfig = {
  callbacks: {
    ready: function() {
      if (RH_MFxxxxxxxxxx) {
        var referrerCode = RH_MFxxxxxxxxxx.referrer;
        
        if (referrerCode) {
          // Logic to execute if a referrer code is present
          console.log("Referrer Code Found: " + referrerCode);
          // Example: Apply discount, personalize page, etc.
        } else {
          // Logic if no referrer code is found
          console.log("No Referrer Code Detected");
        }
      }
    }
  }
}
```

* **Step 1**: The script waits until ReferralHero is fully loaded by using the `ready` callback.
* **Step 2**: It checks whether the `RH_MFxxxxxxxxxx.referrer` variable has a value.
* **Step 3**: Depending on whether a referrer code is present, different logic can be applied. For instance, you might apply a discount if a referrer code is found.

{% hint style="warning" %}
**Important:** Replace `'MFxxxxxxxxxx'` with your actual campaign UUID. This UUID is essential to get the correct referrer code.
{% endhint %}

## Practical Applications of `RH_MFxxxxxxxxxx.referrer` <a href="#practical-applications-of-rh_mfxxxxxxxxxx.referrer" id="practical-applications-of-rh_mfxxxxxxxxxx.referrer"></a>

Knowing whether a user was referred allows you to enhance their experience on your website. Here are two practical examples:

1. **Automatic Discount Application**: Suppose you want to offer a special discount to users who were referred by others. By checking if `RH_MFxxxxxxxxxx.referrer` has a value, you can automatically apply a discount code during the checkout process.
2. **Personalized Landing Page Content**: You can personalize the text, offers, or even the entire layout of a landing page based on the referrer code. For instance, if the user was referred by a friend, you might display a welcome message mentioning the referrer’s name.

**Implementation Example Applying discount if Referred:**

{% tabs %}
{% tab title="JavaScript" %}

```html
<script type="text/javascript">
  window.RHConfig = {
    callbacks: {
      ready: function() {
        var form = document.getElementById('checkout-form');
        form.addEventListener("submit", function(e) {

          var discount_code = form.querySelector('#discountCodeInput').value

          if (RH_MFxxxxxxxxx) {
            var referrerCode = RH_MFxxxxxxxxx.referrer;
            console.log("Referrer Code:", referrerCode);

            if (referrerCode) {
              // Apply the discount code entered in the form
              var discountCode = discount_code;
              console.log("Discount applied: " + discountCode);
            } else {
              console.log("No Referrer Code Detected");
            }
          }
        });
      }
    }
  };
</script>
```

{% endtab %}

{% tab title="Web Form" %}

```html
<form id="checkout-form">
    <label for="name">Name:</label>
    <input type="text" id="name" name="name" required>

    <label for="email">Email:</label>
    <input type="email" id="email" name="email" required>

    <label for="discountCode">Discount Code:</label>
    <input type="text" id="discountCodeInput" name="discount_code" placeholder="Enter discount code" required>

    <button type="submit">Submit</button>
</form>
```

{% endtab %}

{% tab title="Outputs" %}

<figure><img src="https://363135598-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-LsuqexOLPOWiUrWg_Ko%2Fuploads%2F2N3CSCWe7EmhcHjaUm3l%2Fimage%20(2).avif?alt=media&#x26;token=dcefc15c-b511-4fb2-91e1-ea587bc6c3d6" alt=""><figcaption><p>If Referred:-</p></figcaption></figure>

<figure><img src="https://363135598-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-LsuqexOLPOWiUrWg_Ko%2Fuploads%2Fu6pDrB55XcG7dyIdNeBr%2Fimage%20(3).avif?alt=media&#x26;token=f07133e0-1e98-4dc4-864f-2f22c00fa93a" alt=""><figcaption><p>If not Refered:-</p></figcaption></figure>
{% endtab %}
{% endtabs %}

*This is just an example; you can use it in your own way. You can replace the `console.log` statement with your own logic, depending on your use case.*