Use Links to Automatically Fill a Shack Forms Field

: Written by Steve Burge Steve Burge; Published: 19 April 2021 19 April 2021

Imagine that you create a link that says "Click here to book a trip to London". When your visitor clicks the link, they go to your booking form and "London" is already selected in the form.

This sounds pretty awesome, right? It makes things really easy for your visitors and increases the chance that they will buy from you.

In this tutorial, we'll show you how to modify links so you can automatically make form selections for your visitors. We'll be using the Shack Forms extension.

Step #1. Create the required form

Get started by create a Shack Form. If this is your first time with Shack Forms, use this quick start guide.

For my demonstration, I created a basic form with the following fields:

First Name.
Last Name.
Email Address.
Trip to book.

This is how my form looks in the backend:

basic form backend

And this is how my visitors will see this form on the frontend:

basic form frontend

The "Trip to book" is the field that I would like to be pre-loaded.

For the next step, I need to copy this filed alias, which is "tripname":

field alias

We created our form.
We selected which field of this form we would like to be pre-loaded.
We copied the alias of this to be pre-loaded field.

We are ready to move to the next step.

Step #2. Create the required link

This is where the magic of pre-loading actually gets created.

Create your link using the following format:

<a href="#" class="pwebcontact98_toggler" data-pwebcontact-fields="tripname=London">Your link text goes here</a>

The key for preloading to happen is the "tripname=London" pairing after the data-pwebcontact-fields= bit.

Place your own field alias to the left of the equal sign (instead of my alias "tripname").
Place your own value to populate this field with to the right of the equial sign (instead of my London").
Click Save & Close.

If you now go to your site frontend and click on this link, you will see your form gets displayed with the "Trip to book" field pre-loaded with London:

trip to book preloaded with london