How to open the Lightbox form with a custom button?

Please check the url page.

I'm trying to have a button that shows a lightbox form, the first one you see is a common button from wordpress, but don't know how to set it to open my jotform.

The second button is the one I included following Jotform instructions from other support
(https://www.jotform.com/answers/295127-how-i-can-create-a-lightbox-form-with-a-button-instead-of-text-to-open)

But isn't working for me, nothing happens when we click the button.

I'm sending my code in an attached image.

Thank you

I have checked your code and indeed only the text is working, both the first and the second button you've added are not working.

I have tested this on my end and I can get it working fine, here are the steps I followed.

First I copied the code as it is given by the publish wizard, so I got this code: 

<script src="https://form.jotformz.com/static/feedback2.js?3.3.REV" type="text/javascript">

      var JFL_50943465814662 = new JotformFeedback({

        formId: '50943465814662',

        base: 'https://form.jotformz.com/',

        windowTitle: 'Subastar.com.ar',

        background: '#FFA500',

        fontColor: '#FFFFFF',

        type: 'false',

        height: 500,

        width: 700,

        openOnLoad: false

      });

    </script>

      <a class="btn lightbox-50943465814662" style="margin-top: 16px">

        Subastar.com.ar

      </a>

Then I copied the first form from your webpage with its style and added it into the same page where I pasted the Lightbox form code, this is the code for your button: 

<a class="vc_general vc_btn3 vc_btn3-size-md vc_btn3-shape-square vc_btn3-style-flat vc_btn3-icon-left vc_btn3-color-black" href="#" title="" target="_self"><i class="vc_btn3-icon fa fa-pencil"></i> INQUIRY FORM</a>

Now if you want to use a custom button to show the Lightbox form then you only need to copy this class "lightbox-50943465814662" and add it to the custom button, so your button should look like this: 

<a class="vc_general vc_btn3 vc_btn3-size-md vc_btn3-shape-square vc_btn3-style-flat vc_btn3-icon-left vc_btn3-color-black lightbox-50943465814662" href="#" title="" target="_self"><i class="vc_btn3-icon fa fa-pencil"></i> INQUIRY FORM</a>

Do note that this is the only change I made in the code, only added the class and it worked.

You can see my embedded form working on this link: CLICK HERE.

If you have access to the code for the button that you've added from Wordpress then you can simply add this class, if you want to use your custom code, please do the same and if it still does not work you may provide us the source code for your button, we will be glad to help you to get it working. 

Please do let us know how it goes.

I have also found that there are some errors in the web console, this will not allow the form to work properly: 

I have also found that the code looks different, also the ID set in the JavaScript code is not the same like the ID in the <a> tag, ensure it is the same ID to get it working:

So I would suggest you to get the code again and make sure it is being properly embedded, once you embedded the form make sure you're using the correct form ID in the HTML <a> tag, it should be this one 50943465814662.

I have fixed it and it works fine, this should be the button's code fixed: 

<a class="lightbox-50943465814662" style="cursor:pointer">

<p><input id="form_button" type="button" value="Inquiry Form" class="btn"></p>

</a> 

With the corrected ID works, please test it and let us know if you have questions. 

Thanks for your help,
but it didn't work!

When I thought I've got it working, I looked bellow, and the rest of the content was messed up, the pictures and the tabs are not working properly.

I have checked your webpage and I can see the code is fine now, in fact the form is working now, see what I got when tested the button: 

Seems like you were able to resolve the issue; however, if you still need more help, please let us know, we will be glad to further assist you. 

Hi Kevin,

No, is not working properly, because something in the code must have messed up the rest of the page.

if you look bellow in the page, the grey boxes are pictures that are not showing, and the tabs are also wrong :-/

Yes, I can see the same on my end; however, I have checked the web console and I can see there are some conflicts , please see my screenshot: 

So if there is something in the code that messed up your website, I would suggest you to remove it, check the web console and find if the errors are still there, please fix the JavaScript errors shown in the web console and then try re-embedding the form using the code given in the wizard. 

After we've checked that all is working fine we should change the button that triggers the Lightbox form.

These keyboard shortcuts will help you to get the console if you're using Google Chrome:

Mac: Command + Option + J

Windows: Control + Shift + J