> For the complete documentation index, see [llms.txt](https://village-labs.gitbook.io/coworker-product-and-developer-docs/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://village-labs.gitbook.io/coworker-product-and-developer-docs/legacy-knowledge-base/referrals-connections/pre-populating-users-unique-referral-codes-in-signup-flows-and-forms.md).

# Pre-populating Users' Unique Referral Codes In Signup Flows & Forms

A how-to guide for ensuring a user's unique referral code is pre-populated in your signup flow or form when they share their unique referral link.

## **Background**

The most frictionless way for a user to share a referral code is when they share a link to your signup flow or form that pre-fills their unique referral code in your signup flow's referral code field. You're able to configure this with Village's referrals setup.

## **Configuration with HTML form**

1. Go to Side Menu > Referrals > Create New Referral
2. Mark 'Create a unique link and code for users'
3. You'll see this input:

<figure><img src="https://3561055466-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2Fcl1KIMhPQkmG41x5eGvL%2Fuploads%2FofPckIhtwHWw4768ck4M%2FScreen%20Shot%202023-10-02%20at%202.29.14%20PM.png?alt=media&amp;token=c83b7aa5-b831-48f5-b590-3d5ab39957c2" alt=""><figcaption><p>Configuring the referral code</p></figcaption></figure>

3. When creating the referral program, point '<https://your-url.com/signup/>' to your domain's signup specific landing page. This will ensure that the referral link that is shared by a user will point at your landing page.&#x20;
4. If you want the user's code to be pre-filled in the referral code field in your signup form, you will generally have to modify the code of your web page and use a server-side or client-side programming language, like JavaScript, to parse the URL and fill in the referral code field automatically when the page loads.
5. Structure your URL such that the referral code can be passed as a query parameter, eg: [https://your-url.com/signup/?referral\_code={your\_code}](https://your-url.com/signup/{your_code}).
6. Ensure your referral code field in the signup form has a unique ID so that it can be selected using JavaScript. For example:&#x20;

```
<input type="text" id="referralCode" name="referral_code" />
```

7. Parse the URL and set the value of the referral code field. Use JavaScript to parse the URL and pre-fill the referral code field when the page loads. Eg. add this script to your web page:

```
<script>
document.addEventListener('DOMContentLoaded', function() {
    // Parse the URL
    const urlParams = new URLSearchParams(window.location.search);
    // Get the referral code from URL parameters
    const referralCode = urlParams.get('referral_code');

    // If a referral code is present, set the value of the referral code field
    if(referralCode) {
        document.getElementById('referralCode').value = referralCode;
    }
});
</script>

```

8. Back in Village, input the URL you created in step 5. above into the unique link field when creating a new referral structure in Village:

<figure><img src="https://3561055466-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2Fcl1KIMhPQkmG41x5eGvL%2Fuploads%2FofPckIhtwHWw4768ck4M%2FScreen%20Shot%202023-10-02%20at%202.29.14%20PM.png?alt=media&amp;token=c83b7aa5-b831-48f5-b590-3d5ab39957c2" alt=""><figcaption></figcaption></figure>

#### Expected Workflow:

1. User goes to the URL when a referral code generated in Village is shared. Eg. [https://your-url.com/signup/?referral\_code={your\_code}](https://your-url.com/signup/{your_code}). The 'your\_code' part is generated as a unique code for each user in Village.
2. The JavaScript code reads the `referral_code` parameter from the URL.
3. If a referral code is found, it sets the value of the referral code input field with the ID `referralCode` to the read referral code.

## **Configuration with Google Form**

Pre-populating a referral code in a Google Form field is relatively straightforward.&#x20;

1. Go to Side Menu > Referrals > Create New Referral
2. Mark 'Create a unique link and code for users'

<figure><img src="https://3561055466-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2Fcl1KIMhPQkmG41x5eGvL%2Fuploads%2FofPckIhtwHWw4768ck4M%2FScreen%20Shot%202023-10-02%20at%202.29.14%20PM.png?alt=media&amp;token=c83b7aa5-b831-48f5-b590-3d5ab39957c2" alt=""><figcaption><p>Configuring the referral code</p></figcaption></figure>

3. Go to the Google Form where you want to pre-propulate the referral code when shared. Make sure you have a 'Referral Code' field created in the form.&#x20;
4. Click on the three vertical dots in the top right corner of the form. Select “Get pre-filled link.”
5. Fill out the form with the values you want to be pre-filled. In this case, write something like 'prefilled\_value' into the 'Referral Code' field and leave the other fields blank.
6. Click on “Get Link” at the bottom right.
7. Copy the provided URL; this is your pre-filled form link.
8. The URL you copied will look something like this:

```
https://docs.google.com/forms/d/e/[FORM_ID]/viewform?usp=pp_url&entry.[FIELD_ID]=prefilled_value

```

9. Back within Village, replace '<https://your-url.com/signup/>' in the unique link input field with the link you copied, replacing 'prefilled\_value' with '{your\_code}'. It should look something like: '<https://docs.google.com/forms/d/e/\\[FORM\\_ID]/viewform?usp=pp\\_url\\&entry.\\[FIELD\\_ID]={your\\_code}>'
10. Create and test the link. If it is working successfully, when you enter the link, it should direct to your form with '{your\_code}' prefilled in the Referral Code field.&#x20;
11. When a user copies and shares their referral code link on their dashboard generated with this referral program, it will direct those they share it with to your Google Form signup with their unique code prefilled. Make sure you test this.


---

# Agent Instructions
This documentation is published with GitBook. GitBook is the documentation platform designed so that both humans and AI agents can read, navigate, and reason over technical content effectively. Learn more at gitbook.com.

## Querying This Documentation
If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter, and the optional `goal` query parameter:

```
GET https://village-labs.gitbook.io/coworker-product-and-developer-docs/legacy-knowledge-base/referrals-connections/pre-populating-users-unique-referral-codes-in-signup-flows-and-forms.md?ask=<question>&goal=<endgoal>
```

`ask` is the immediate question: it should be specific, self-contained, and written in natural language.
`goal` is optional and describes the broader end goal you are ultimately trying to accomplish on behalf of the user. GitBook uses it to tailor the answer towards what is most useful for that goal.

The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.