I'd Like to Show a "Buy Now" Button on My Website

I really like the forms I can make here and plan to use them to sell products and workshop registrations on my websites.  But of course, I want one improvement.

On my website, I'd like to show a Buy Now button, but don't see how to generate a button, only a link.  

I like the Submit button you have at the bottom of your forms, especially after I customize it.  Is there a way I can generate a similar button to put on my website to trigger your popup form?

BTW, the Post Question button at the bottom of this page is very close to what I want.  Just want to change the background color.

many thanks,

Steven

Do you mean you want to add a button in your website that will display a pop-up form created in JotForm? If so, you can embed the form you created in JotForm by using the Lightbox embed code or Feedback Button embed code.

For more information, you can check these articles: How to Create a Lightbox Form and Creating a Feedback Button.

Sample Demo of Lightbox Form:

Sample demo Feedback Button Form:

Do let us know if you need further assistance.
Regards.

Thank you, Christian.

For some reason, the Lightbox solution only creates a line of hyperlinked text, not a button.  It should be creating a button, right?

The Feedback Button solution does create a button, but it isn't anchored on the page.  Instead, it floats against one edge of the browser frame.

Any sense of how to fix either of those problems to get what I want?

Many thanks,

Steven

Hi Steven,

To change link into a button you need to add the "<button>" tag on your Lightbox embed code. Below, you can see the customized code and also, you can directly use it on your webpage:

 <script src="https://form.jotform.com/static/feedback2.js?3.3.REV" type="text/javascript"> var JFL_60824339969167 = new JotformFeedback({ formId: '60824339969167', base: 'https://form.jotform.com/', windowTitle: 'EFT Level 1 Registration', background: '#FFA500', fontColor: '#FFFFFF', type: 'false', height: 500, width: 700, openOnLoad: false }); </script>   <button type="button"><a class="btn lightbox-60824339969167" style="margin-top: 16px"> Buy Now </a></button>

As it is seen from the above, I added the green parts on it. If you want we can add some rules to change the button's appearance. Please, don't forget to let us know the results.

Regards.

Thanks very much.

That does create a button on the page where I want it.  For some reason, I'm unable to affect the background or font colors by changing the hex codes  --  is there a new wrinkle preventing that?

Also, I notice that you're using single quotes around each attribute, instead of double quotes.  Any significance to that?

thanks,

Steven

Steven, you are most welcome. First of all, using single or double quotes doesn't change a thing, so you don't need to take it seriously, it just a easier way to add quotes on my keyboard.

If we come to the main question, you can style the button by adding rules into <button> HTML tag. Please, see it from the below:

 <script src="https://form.jotform.com/static/feedback2.js?3.3.REV" type="text/javascript"> var JFL_60824339969167 = new JotformFeedback({ formId: "60824339969167", base: 'https://form.jotform.com/', windowTitle: 'EFT Level 1 Registration', background: '#FFA500', fontColor: '#FFFFFF', type: 'false', height: 500, width: 700, openOnLoad: false }); </script>

<button type="button" style="border: 5px solid grey; width:100px; height: 50px; background-color: #aea9a9; font-family: 'Arial Black'; font-weight: bold; font-size: 15px; color: white;"><a class="btn lightbox-60824339969167" style="margin-top: 16px"> Buy Now </a></button>

As it is seen from the above, you can add the CSS rules between style="...". Also, you can see the results from the below:

If you need any extra information, please do let us know.

Regards

Gradually, I am getting the hang of HTML.  Your answer gave me the key I needed.  Plus a web search for the exact format of 'border-radius: 10px;'

That did it.  Thanks so much for your help.

I'm now here, and this also gives me confidence that I can convert to using JetForm on all my websites, because any future glitches will get resolved.

Steven

We really happy to hear that! Whenever you need assistance feel free to contact us.