Custom form integration in klaviyo

Custom form integration in klaviyo

October 21, 2021

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.

Share This Story, Choose Your Platform!

Lets Discuss On Your Store

Avada Programmer

Hello! We are a group of skilled developers and programmers.

Hello! We are a group of skilled developers and programmers.

We have experience in working with different platforms, systems, and devices to create products that are compatible and accessible.

Go to Top