search
Getting StartedFeaturesIntegration

Configuration File

ReferralHero utilizes a configuration file behind the scenes, containing all the properties of your campaign, such as the color of buttons, header text, social buttons to display, and more.

Note: Use the custom configuration file only if you want to customize the properties of your campaign.

hashtag
Custom Configuration File

You can manually override any setting by using a custom configuration file. To do this, instantiate a global window.RH_MFxxxxxxxxxx_Config object before the Tracking Pixel. The custom configuration file must be instantiated before the Tracking Pixel; otherwise, it won't work.

This is particularly useful when you want to make changes "on-the-fly" or only on specific pages. You don't need to specify every property—just include the settings you want to change, and ReferralHero will use your campaign defaults for the rest.

triangle-exclamation

Important:

  • The custom Configuration file must be instantiated before the Tracking Pixel or else it won't work.

  • Replace 'MFxxxxxxxxxx' with your actual campaign UUID. 

<script type="text/javascript">
  window.RH_MFxxxxxxxxx_Config = {
      defaults: {
        form_container_id: "maitre-widget", // The ID of the div where the form will appear.
        sharing_screen_container_id: "maitre-sharing", // The ID of the div for the sharing screen.
        default_url: "http://referralhero.com", // The URL for creating referral links.
        source: "Twitter", // The marketing channel attribution.
        email: "john@smith.com", // Default value for the email field.
        name: "John Smith", // Default value for the name field.
        extra_field: "USA", // Default value for the extra_field field.
        extra_field_2: "+1 123456789" // Default value for the second extra_field field.
      },

In this snippet, we start by setting up some default values. The form_container_id is where the form will be placed on your webpage. Similarly, sharing_screen_container_id is where the sharing screen will appear. The default_url is the link that will be used for referrals, and source determines the marketing channel. Default values for email, name, and additional fields are also set here.

Here, the settings section provides additional controls, such as enabling event tracking or the one-click-signup feature. For instance, you can customize the URL parameters for tracking user data like name, email, and extra fields.

This part of the configuration deals with the floating button. You can toggle it on or off, customize the text, color, and position on the screen to match your website’s design.

The design section allows you to control the appearance of your form. You can enable or disable styling and even provide custom CSS to further tailor the look and feel of the form.

Next, the form section is where you define the actual content and layout of the form. You can add a cover image, set up the header text and color, and control the fields that users will fill out, such as name and email. Additionally, you can customize the submit button’s text and color

The sharing section is where you manage what happens after users sign up. You can enable redirection and customize the sharing screen. You can also set up email verification reminders to ensure users complete the process.

Next, in the socials section, you can control which social media platforms will be available for sharing. For instance, you can allow sharing on Twitter with a custom message or enable sharing on Facebook and email. You can also choose to disable other platforms like WhatsApp or LinkedIn if they’re not relevant to your campaign.

In the leaderboard section, you can display a leaderboard showing the position of each subscriber based on the points they’ve earned. You can customize the labels for position, subscriber, and points, as well as add a footnote explaining the points system.

Lastly, in the rewards section, you can showcase the rewards subscribers can win. You can list different rewards with titles, descriptions, and images, and specify how many referrals are needed to unlock each reward.

The alerts section lets you define custom messages for various situations, such as when a subscriber is not found, has already been promoted, or fails the reCAPTCHA. You can also set alerts for incomplete forms or server issues.

The callbacks section is where you can define custom functions that will execute in response to specific events. For example, you might use callbacks to handle actions after a user submits a form or interacts with the campaign in a particular way.

This part of the code is currently empty, but you can add functions here to customize the behavior based on your campaign needs. For more details on how to use callbacks, refer to the Callbacks article.

hashtag
Key Points

  • The window.RH_MFxxxxxxxx_Config object must be instantiated before the Tracking Pixel.

  • You only need to include the properties you want to override; ReferralHero will use campaign defaults for others.

  • The configuration allows for dynamic adjustments to the campaign on specific pages or conditions.

PreviousGetting StartedNextCallbacks

Last updated