klaviyo form on button trigger

3 0 1

I'm trying to add a klaviyo form to a button which will appear when the button is clicked. I have successfully configured shopify to klaviyo and created the form where it provides a code. 


To get the button to trigger the form I would need to edit the theme code, I have been trying to edit the section (impact-text) which contains the button. I was able to successfully get the text on my website and was able to trigger the form when clicked. However, the button link is not in the same design as my original button. 


Here is the code I'm meant to add to the theme:


<button class="klaviyo_form_trigger">Click here</button>
<script type="text/javascript">
document.querySelector('.klaviyo_form_trigger').addEventListener('click', function (){
window._klOnsite = window._klOnsite || [];
window._klOnsite.push(['openForm', 'MY-CODE']);

and here is the section in my code where I'm meant to change


<div class="impact-text__content">

                    {{- block.settings.content -}}
                    {%- if block.settings.button_text != blank -%}
                      {%- render 'button', content: block.settings.button_text, href: block.settings.button_url, size: 'xl', background: section.settings.button_background, text_color: section.settings.button_text_color -%}
                    {%- endif -%}

I'm meant to change the render 'button' section but I cant seem to figure it out!!


Could someone help please


Reply 1 (1)
New Member
13 0 0

any advice on this? having the same problem