Table of Contents

Link Widget (Embedded)

Tyra Earl Updated by Tyra Earl

The Link Widget option allows you to add an HTML snippet to any button, text, or another linkable object on your site. When clicked, your Referral Rock program will pop over the current page in a beautiful overlay. 

Member Portal 2.0 embed experiences offer sharing options only and do not support the Member dashboard or statistics. For more information, please reference our Member Portal 2.0 Embed Experience article.

The Link Widget integrates with your existing site architecture. You may use a custom button, picture, or any other linkable call to action which will then display your program when clicked.

After the visitor clicks the button, it acts as a link to the program's Widget URL and the visitor sees the following:

  1. Click on the Programs tab on the Dashboard or click here. You can also navigate to Settings > Integrations > Member Access > Link Widget or click here.
  2. Select your Program.
  3. Copy the Widget Link under Program Details. You can also select the Integrate Widget button from the Integrations section of the Program page.
  4. Paste the link to your site. You can add the link by itself or use it as the href of a button, image, or any other object that can act as a hyperlink.

Advanced Installation - One Click Access and Autocomplete

One Click Access

If you have the users' name and email address you can automatically register the user as a Member of your program. This can provide a nearly friction-less experience for new members of your referral program.

If you are using Member Portal 2.0 Embed Experience, this method can be used to automatically Register and Login Members to allow access to the Share Block only.
Building your One Click Access URL
  • Navigate to the desired Program > Program Details > Integrate Widget
  • Click on Build Your One Click Access URL
  • One Click Access is commonly used to automatically register members from an emailed link. While we have built out links for many email service providers, we will want to use the < Service Not Listed - Custom > option in order to provide instant access on your website. Copy the URL.
    • An example of what the URL will look like: https://yoursite.referralrock.com/access/?programidentifier=XXXXXXXX-XXXX-XXXX-XXXX-XXXXXXXXXXXX&view=widget&firstname={{FIRST_NAME}}&lastname={{LAST_NAME}}&email={{EMAIL}}
  • Determine what your site uses for parameters for First Name, Last Name, and Email. You may add additional parameters to the URL
    • For example, if your site's parameter for First Name is "FName", Last Name is "LName", and Email is "userEmail" then the completed link will look like this:https://yoursite.referralrock.com/access/?programidentifier=XXXXXXXX-XXXX-XXXX-XXXX-XXXXXXXXXXXX&view=widget&firstname=FName&lastname=LName&email=userEmail
    All subsequent parameters are joined by an “&” symbol.
  • Attach the completed URL to any linkable object on your site, such as a button, hyperlink, or image.

Autocomplete

If you have the users' name and email address you can automatically fill it in for them.

Building your Default Fill URL
  • Navigate to the desired Program > Program Details > Integrate Widget
  • Click on Build Default Fill URL.
  • Autocomplete is commonly used to automatically fill in a user's name and email on the Member Registration page from an emailed link. While we have built out links for many email service providers, we will want to use the < Service Not Listed - Custom > option in order to provide instant access on your website. Copy the URL.
    • An example of what your URL will look like: https://yoursite.referralrock.com/widget/1/?firstname={{FIRST_NAME}}&lastname={{LAST_NAME}}&email={{EMAIL}}
  • Determine what your site uses for parameters for First Name, Last Name, and Email. You may add additional parameters to the URL
    • For example, if your site's parameter for First Name is "FName", Last Name is "LName", and Email is "userEmail" then the completed link will look like this:
      • https://yoursite.referralrock.com/widget/1/?firstname=FName&lastname=LName&email=userEmail
    All subsequent parameters are joined by an “&” symbol.
  • Attach the completed URL to any linkable object on your site, such as a button, hyperlink, or image.
Each field needs to be individually encoded for links to work properly. For a better understanding of URL encoding and what an encoded URL looks like, visit http://www.url-encode-decode.com/. If you are using Javascript for your coding environment, visit W3 School's page on encoding URLs for more information. For example, special characters in a name will cause an error when used in a URL unless it has been encoded.

How did we do?

On-Site Widget (Overlay)

Member Portal Embed Experience

Contact