How to add Jotforms form in a popup modal window?

Support
#1

Hi, I’ve been using ConvertPlus to add popup modals to some CTAs on my website. Unfortunately ConvertPlus (for some reason) stopped my website from working (buttons, animations, previews etc all disabled when ConvertPlus is activated…see my other posts). Anyway, I’ve now made a form in Jotform (thats what I need to use to connect to our CRM system) and would like to add it in a popup lightbox when someone clicks on the CTA. This is the code I’ve got from Jotform:

Card Terminal CF

I’ve no idea where this goes so the lightbox (including form) popups up when someone clicks the CTA. ConvertPlus was great and easy to use (I just need to insert some shortcode) but sadly killed my website. Any assistance would be greatly appreciated. Thanks.

#2

Hi There,

You can add your embed code to the text element:

<script src ="https://form.jotformeu.com/static/feedback2.js" type="text/javascript"></script><script type="text/javascript"> var JFL_82113433240341 = new JotformFeedback({ formId: '82113433240341', base: 'https://form.jotformeu.com/', windowTitle: 'Card Terminal CF', background: '#FFA500', fontColor: '#FFFFFF', type: 'false', height: 500, width: 700, openOnLoad: false }); </script> <a class="btn lightbox-82113433240341" style="margin-top: 16px"> Card Terminal CF </a>

Uploading…

Let us know how it goes!

#3

Hi, thanks for the reply. Yeh, I managed to embed a JotForm’s form straight into a page…I’m fine with that (just put source code straight into a text box…easy peasy). What I want to know is how to add a JotForm form into a lightbox/popup modal? That’s where I’m stuck. Any ideas would be great.

#4

Hi, I’ve been in contact with Jotform, below is the reply I got from them regarding adding a JF form to a popup window. Any ideas on how to achieve this in a slightly easier way…I’m quite new to WP development and am quite unsure how to do this…and I’m sure I’ll probably break something if I tried.

#5

Hi there,

Instead of adding the form code in a text element, add it to a Content Area Modal element then add the code to the element’s Modal Content field.

You can then customize the element text using the Text Setup option under Toggle.

Hope this helps.

#6

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.