In this tutorial, I will shed some light on how you can easily redirect the WordPress form to your thank you page.
🛠The tools used in this tutorial:
- free JetFormBuilder WordPress plugin
- JetEngine plugin (optional)
- Elementor free version (optional)
If you are a more visual learner, here is the video tutorial for you:
Step 1. Create WordPress Thank You Page
I already created a simple page that says Thank you! Your request has been successfully sent! And it also has a subscribe button. Super simple and I’m sure you can do something similar. You can create the page using a native WordPress editor or Elementor page builder.
Step 2. Set up Redirect to a Thank You Page
After creating the WordPress form, we need to set up a redirect to Thank you page action.
If you haven’t created your form yet, I have some tutorials for you:
If you haven’t used Post Submit Actions, I suggest you take a look at this documentation.
Basically, these actions determine what’s gonna happen to this form after submission, whether it’s gonna send an email, register a user, and so on.
The list of all available actions can be found in the JetFormbuilder settings, under the Post Submit Actions.
And there is also the one that will be used in this tutorial — Redirect to Page. Select it and hit on Edit action button.
Under the Redirect to, we need to choose one of these options: static page, custom URL, current page, or inserted post.
For our first case, I will set it to Static Page and then just simply select the needed page in the drop-down list:
Also here you can add query arguments to the redirect URL if needed.
That’s it. Don’t forget to update and let’s check if it works.
That is my form, I will fill it in and click on the Send button.
Here we go. It redirected us to the Thank you page.
In case you like to proceed with more complicated options for personalizing your Thank you page, feel free to proceed with the next step, but if you are okay with the simple way, thank you for reading, and don’t forget to subscribe to not miss anything. 😊
How to Create a Personalized Message for Thank You Page?
For this step, you need a JetEngine to be installed and a CPT created. All our forms are stored under a certain post type.
In my case, I created a Custom Post type that contains the list of meta fields that were repeated in the form I showed you before:
- Name meta field
- Phone number
- Wedding date
- Number of guests and so on.
This way every form will be stored as a post and the information the user entered will be saved under the appropriate meta fields.
But how do you save a submitted form as a post?
JetFormBuilder has a post submit action that is called Insert/Update Post. If you haven’t used it before, I recommend you take a look at Setting Up Frontend Post Submission tutorial.
It’s a very detailed video and it will help to set everything up.
So, get back to our Insert/Update post action, and press Edit button, in the Fields Map I connected the form field Name with the meta field of the chosen CPT.
The data from the posts can be displayed with the help of dynamic widgets. The next step is to create a listing since dynamic widgets won’t work on the thank you page itself.
First of all, we quickly create a listing template, and then we will add it to our thank you page.
If you haven’t used Custom Post Type before, please, take a look at this tutorial.
Now, I’m gonna go to the dashboard, JetEngine — Listings — Add new.
Select Posts as a listing source. Then choose your custom post type, set a name, and click on create the listing item.
And here I will create just one section and place a Dynamic Field widget inside it.
Dynamic Field will pull the necessary data, so if I want to pull the name of the user who submitted the form, I need to set the source to Meta Data and then specify the field.
Be attentive here, as you need to select the same field that is present in your form.
So, in my case, I will set it to the Name meta field of the Wedding CPT.
Don’t worry if it doesn’t pull anything and you have a blank space here.
That just means, there are no posts yet, so Dynamic Field cannot display any data.
Two more steps and we’re done. I'm gonna scroll down to Field format and enter:
Thank you, %s!
Lastly, go to the listing settings. And check if you have the right source selected for this template.
Then click on Publish.
Now we just need to go back to the Thank you page and firstly I will remove the heading and then apply a Listing Grid widget.
Under the General settings select the listing you just created. There will be just one column and also don’t forget to set the Posts number to 1. Adjust the position and that’s it.
To check if everything works properly, I’m gonna go to my website’s home page, click on this button that redirects to the page with the form.
Now, once it’s filled in, I will click on Send, and here’s my thank you page. So as you can see the dynamic field widget pulled the name I previously entered in the form.
Hiding a Form Using Dynamic Visibility
Dynamic visibility is a JetEngine feature allowing you to adjust content visibility logic according to custom scenarios. You can create and apply display restrictions to different sections, widgets, and columns.
Conclusions
So, I really hope this tutorial was helpful for you. As you can see you can make simple redirection to thank you message or page via free JetFormBuilder & WordPress.
Otherwise, you can add advanced functionality and personalize your WordPress Thank you page with JetEngine & Elementor page builder.
