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.