Display URL parameter in text

Hi there,

I’m creating individual sign up pages automatically with URL parameters. So when a user signs up, he is automatically connected to the agency he/she is working with.

Technically it’s working great (hidden field + url parameter). But right now it’s a normal sign up page with no indicator to which agency they are signing up to.

So I’m wondering if it’s possible to display a URL parameter in a text field?

The usecase would be to include the agencys name in the url and then the sign up page can show something like “Welcome to AGENCY NAME”.

This would indicate it clearly for the user.

Any help with this? Couldn’t figure it out.

Thank you!

1 Like

Hi @Lukas

Welcome to the community! First off, great job getting it to work post signup. At the moment, I cannot think of any way to addon to this experience using URL params on your signup page, but I’ll double check with the team. If they find anything, I’ll get back to you!

Hi,

I may have a solution with custom code:

In your signup block, add <span>agencyName</span> next to Sign up text (see first screenshot).

In your page settings, go to custom code, then the footer custom code and add this script and change in the first line user-accounts1 by the ID of your signup block

<script>
  window.addEventListener('block-loaded-user-accounts1', () => {
    function getUrlParameter(name) {
      name = name.replace(/[\[]/, '\\[').replace(/[\]]/, '\\]');
      var regex = new RegExp('[\\?&]' + name + '=([^&#]*)');
      var results = regex.exec(location.search);
      return results === null ? '' : decodeURIComponent(results[1].replace(/\+/g, ' '));
    }

    var agencyName = getUrlParameter('agencyName');
    var targetElement = document.querySelector('#user-accounts1 > section > div > div > div > div > div > h2 > span');

    if (targetElement) {
      targetElement.textContent = agencyName;
    }
  });
</script>

Explanation:

In airtable I created a formula field with agencyName as a url parameter. {Agency Name} is the dynamic part that should be your Airtable field with the agency name inside.

I use ENCODE_URL_COMPONENT for the case where the agency has a space between two words (for example… Agency A => space between Agency and A => without encoding the A won’t appear in the url parameters)

"https://yourappdomain/sign-up-with-url-param?agencyName="&ENCODE_URL_COMPONENT({Agency Name})

To replace the <span>agencyName</span> with the script (it is ruled by the line var targetElement = document.querySelector('#user-accounts1 > section > div > div > div > div > div > h2 > span');) see second screenshot.

Tell me if you need additional help, tests made , it works.


2 Likes

Thank you so much!!

Wow @matthieu_chateau !! I bookmarked this one for myself. This is a work of art =) Thanks for sharing!!!