Custom form integration in klaviyo

Custom form integration in klaviyo is tricky. It requires some custom code. We need to do the following process:-

  • Edit the Custom Form make it with GET method
  • Change the form action to klaviyo
  • Add a klaviyo javascript library
  • Add a custom script and connect form to script

Edit the Custom Form make it with GET method

Suppose I need to do custom form integration in klaviyo

<form method='GET'>
<input type="email" name='email'>
<input type="submit">
</form>

Change the form action to klaviyo

Here is guide how we can get from action from klaviyo

Copy the URL as shown in below screenshot

<form method='GET' action="https://manage.kmail-lists.com/subscriptions/subscribe?a=V6rnNa&g=RvgAs2">
<input type="email" name='email'>
<input type="submit">
</form>

Add a klaviyo javascript library 

<script type="text/javascript" src="//www.klaviyo.com/media/js/public/klaviyo_subscribe.js"></script>

Add a custom script and connect form to script 

<script type="text/javascript">
 KlaviyoSubscribe.attachToForms('#email_signup', {
 hide_form_on_success: true
 });
</script>

Add id to connect form to script

<form id='email_signup' method='GET' action="https://manage.kmail-lists.com/subscriptions/subscribe?a=V6rnNa&g=RvgAs2">
<input type="email" name='email'>
<input type="submit">
</form>

This is a process to custom form integration in klaviyo. If you facing issues to do functionality. Connect us we will help to setup this integration.

We only charge $20 for this work. Let us know if you need our help.

Contact Us