Forms: How to redirect to a thank you page after submitting a form

If you'd like to redirect customers to a thank you page after a newsletter or contact form submission, use this modification.

1

Create the thank you page

In the Page editor, create a new page:

Give the page a title like:

You can add the content to the page (your message) later. 

Save the page.

Next after saving, scroll to the bottom SEO section and click on Edit website SEO:

Make note of this URL - More specifically the highlighted section after /pages/

We are going to need that for the code in the next step. You'll want to return here and copy that portion. 

Add some content to the page at this point if you like and save the page. 

2

Edit the newsletter-form.liquid file

How to:

Always make a duplicate of your theme before adding any code. This will save you if anything goes wrong or if you decide not to use the added code in the future. We can not support or be responsible of any code changes that you make to your theme. For that reason, save yourself and make a duplicate first.

Make a duplicate before any code changes:

Next, open the Code Editor:

From your list of themes, find the Actions link for the theme you'd like to edit. Then select Edit code. Example draft theme:

Example if you're working from your main live/published theme:

Quick link if the theme is live/published:
Open Code Editor

Open this newsletter-form.liquid from the Snippets folder:

In the code area at the top, make a few blank links after this line (after line 3):

Example:

Next, paste the following code in that area:

<script> 
  
  window.location = "/pages/thank-you-for-contacting-us"; 
  
</script>

Example:

Next, customize that code to match the ending of your URL from Step 1. 

Verify it's exactly the same from that SEO section:

Must match:

Be sure the rest of the code isn't affected when you paste it. The code must be exact as above (in quotes and ending the line with a semi-colon).

Verify your code is correct one more time. If not, copy the sample code again and start Step 2 over. 

Save the file.

Now test your newsletter form and verify that the thank you page is being shown. 

If you'd like to add a button on your thank you page, here's some sample HTML code you can use.

On your thank you page, use the code view toggle button in the toolbar:

You'll know you're in code mode, the other toolbar icons disappear:

Then you can paste your button code - Must be in code view, not regular editor.

<p class="text-center"><a class="btn" href="/collections/all">Continue Shopping</a></p>

Button sample:

Note: You need to preview the page to see the button correctly. The Page editor can't show the button style: