Skip to main content
Solved

Is it Possible to Create a Custom 2-Stage Sign Up Form?

  • December 21, 2020
  • 6 replies
  • 235 views

Forum|alt.badge.img+2
  • Contributor I
  • 2 replies

When designing a custom sign up form, is the form ever able to exist with multiple states/screens and still be able to pass data back to the associated customer profile using Klaviyo’s API? For example: 

 

SCENARIO 1

Box 1: 

Enter email, submit

 

Box 2: 

“Would you also like to learn about X,Y,Z?” (Checkboxes that we would use to further segment) 

 

SCENARIO 2

Box 1: 

Enter email, submit

 

Box 2: 

“Would you also like to receive text messages?” Enter SMS info, submit 

Best answer by retention

@blh95 Ah gotcha, the custom coded signup forms, aka “Legacy Forms” have an extra parameter called success_url you can specify to redirect URL:

<script type="text/javascript">
 KlaviyoSubscribe.attachToForms('#email_signup', {
   hide_form_on_success: true,
   success_url: "https://www.example.com/thank-you"
 });
</script>

You can read more about it here:
Redirect Subscribers to a New Page After Submit

 

Hope this helps!

View original
Did this topic or the replies in the thread help you find an answer to your question?

6 replies

retention
Partner - Platinum
Forum|alt.badge.img+62
  • 2025 Champion
  • 965 replies
  • December 21, 2020

@blh95 Klaviyo Signup Forms don’t have multi-stage input forms capabilities yet, but one way to work around this is to have the submission redirect to another URL where you can embed another Klaviyo Signup Form to ask secondary (and other) input fields.

In Klaviyo Signup Form, you can have a submission go to another URL upon submit like this:

 


Forum|alt.badge.img+2
  • Author
  • Contributor I
  • 2 replies
  • December 21, 2020

Hey @retention

 

Thanks for the answer – I’m asking specifically for custom coded sign up forms, not sign up forms built with Klaviyo’s native form builder tool. 

 

Would you happen to know if this is possible from a development standpoint?


retention
Partner - Platinum
Forum|alt.badge.img+62
  • 2025 Champion
  • 965 replies
  • Answer
  • December 22, 2020

@blh95 Ah gotcha, the custom coded signup forms, aka “Legacy Forms” have an extra parameter called success_url you can specify to redirect URL:

<script type="text/javascript">
 KlaviyoSubscribe.attachToForms('#email_signup', {
   hide_form_on_success: true,
   success_url: "https://www.example.com/thank-you"
 });
</script>

You can read more about it here:
Redirect Subscribers to a New Page After Submit

 

Hope this helps!


Forum|alt.badge.img+2
  • Author
  • Contributor I
  • 2 replies
  • December 22, 2020

@retention What if we don’t want to redirect users off-site? We intend to have the sign up form direct to a second page - or state. 


retention
Partner - Platinum
Forum|alt.badge.img+62
  • 2025 Champion
  • 965 replies
  • December 22, 2020

@blh95 - Hmmm. The redirect URL can be any page or URL on your site - it doesn’t have to be off-site.  I’m not quite sure if I understand the question?


cassy.lee
Forum|alt.badge.img+9
  • Klaviyo Alum
  • 271 replies
  • January 3, 2021

@blh95 Like @retention mentions, it is possible to do this via legacy forms, but if you’re looking for something more custom coded, I wonder if this article might be helpful? https://www.w3schools.com/howto/howto_js_form_steps.asp

This shows you how to customize the multisteps in js