Embed Options | Lightbox

Lightbox

Lightbox form is a pop-up that overlays the webpage, blocking some content on the webpage and preventing visitors from interacting with the other content on that page  till the form is closed. This helps in drawing the attention of your website visitors to the form which may otherwise go unnoticed. For example, if you require your customers to subscribe to your newsletter to receive updates about your products and the discounts on them, you can use a LightBox email subscription form on your webpage which shows up after the user has spent a certain amount of time on the website.

To embed your form as a Lightbox pop-up on your webpage,
  1. In your form builder, navigate to the Share tab > Embed > Lightbox.
  2. Click Get Started.

    Get Started
  3. In the pop-up, you can customize the height and width of the form in px to suit your website by selecting the Set Pop-up Dimensions option under Appearance. A scroll will be provided if the form is long.
  4. You can also customize the look of your form by adding color to the border of Lightbox pop-up using the Apply Border & Color option.
  5. Under Launch settings , you can choose when the Lightbox form should pop up on your webpage from the options under Pop-up Launch Criteria.
  6. You can additionally choose to pre-load form as the website loads and keep the form hidden until the selected Pop-up Launch Criteria displays your Lightbox form. Enabling this option will prevent any form loading delays when the website loads.
  7. You can choose to have a Pop-up Launch Button on your webpage which will show up the LightBox form when clicked.
  8. If you wish to prefill your LightBox form and add referrers to track sources,
    1. Configure Field Alias for the fields in the form that you wish  to prefill.
    2. Select the Include URL parameters option.
    3. Map the Parameter Names ( denoted by the configured Field Aliases/ Referrer Name to  track the source from which the form was filled ) to the Parameter Values that are to be prefilled.

      Lightbox Pop-up Customization
  9. Click Get Code and click Copy Code
  10. Paste the copied code to the HTML of your webpage.

Pop-up Launch Criteria

On Page Load

Choose this option if you want the form to load and show up simultaneously with your webpage. The form will be loaded and displayed as soon as the website loads. For example, you can show your visitors a Sign Up form to get a time-sensitive discount on signup in your online store page as soon as the page loads.


On Page-Exit Intent

Choose this option if you want your form to show up when a visitor decides to leave the page in order to re-capture the attention of visitors abandoning your webpage. For example, if a visitor leaves your blog page due to a shortage of time, you can show up a form to get their email address and send a PDF copy of the important details on your website to their email for future reference.

On page exit

After a  Time Span

Choose this option if you want your form to show up after the user has spent some time and engaged with your webpage. Enter the delay in seconds after which your form has to show up over the webpage. For example if you have Sign Up form, it would be appropriate to give the visitors some time to engage with your website before requesting for their details. Choose a time when your visitors will have been influenced by your content and will not be annoyed by your pop-up form.

After a time span

Based On Scroll Percent

Choose this option if you want your form to show up after the user has scrolled to a certain percentage of the website. Scrolling through the content could indicate a visitor's interest on your webpage and choosing to show up the form after they have scrolled to a certain portion, can fuel their interest. For example, you can find the point/section of your website where the user would have received necessary details from the content and show up your Subscription form when the user scrolls down past that point.

Based on scroll percent

You can track referrals to know which website your respondents found your form from and also prefill your embedded forms to make the form filling experience simpler for your website visitors.

How to embed a form with webcam option in Image Upload field?

If your embedded form has an Image Upload field, respondents will not be able to capture pictures using the webcam. To allow this, you must include the following in the embed code:
  1. allow="camera"
  2. ?zf_enablecamera=true
For example:


Enable webcam for an embedded form

    Zoho CRM Training Programs

    Learn how to use the best tools for sales force automation and better customer engagement from Zoho's implementation specialists.

    Zoho CRM Training
      Redefine the way you work
      with Zoho Workplace

        Zoho DataPrep Personalized Demo

        If you'd like a personalized walk-through of our data preparation tool, please request a demo and we'll be happy to show you how to get the best out of Zoho DataPrep.

        Zoho CRM Training

          Create, share, and deliver

          beautiful slides from anywhere.

          Get Started Now


            Get started with Zoho Sign

            in a few quick steps!

            Download Help Guide





                      Still can't find what you're looking for?

                      Write to us: support@zohoforms.com


                            




                            

                          Zoho Marketing Automation

                            Zoho Sheet Resources

                             




                                Zoho Forms Resources


                                  Secure your business
                                  communication with Zoho Mail


                                  Mail on the move with
                                  Zoho Mail mobile application

                                    Stay on top of your schedule
                                    at all times


                                    Carry your calendar with you
                                    Anytime, anywhere




                                          Zoho Sign Resources

                                            Sign, Paperless!

                                            Sign and send business documents on the go!

                                            Get Started Now


                                                Zoho SalesIQ Resources



                                                    Zoho TeamInbox Resources



                                                            Zoho DataPrep Resources



                                                              Zoho DataPrep Demo

                                                              Get a personalized demo or POC

                                                              REGISTER NOW


                                                                Design. Discuss. Deliver.

                                                                Create visually engaging stories with Zoho Show.

                                                                Get Started Now











                                                                                      • Related Articles

                                                                                      • Embed form as a Hyperlink

                                                                                        This option lets you include the form as a hyperlink on your web page. When the website visitors click this link, the form will open in a popup window. To embed the form as a hyperlink: In your form builder, go to Share  > Embed  > Hyperlink. Copy ...
                                                                                      • Embed a form using iframe

                                                                                        Your website layout and the theme used will affect how your form appears in your web page. You can embed your form as a frame on your webpage using the code we provide. We calculate the height and the width of your form based on the container in ...
                                                                                      • Embed a form using HTML/CSS codes

                                                                                        To further modify and customize the forms which you wish to embed in your website, you can download your form as a plain HTML file or a HTML with CSS file.  To do so,  In your form builder, go to Share > Embed > HTML & CSS. Click Generate Code to ...
                                                                                      • Embed a form using JavaScript

                                                                                        A JavaScript code helps you to embed a form in your website as a part of your webpage. Unlike iframe, this option will embed the form as a page element and not as an external resource. You can choose to auto-resize or set custom height for your form ...
                                                                                      • Overview

                                                                                        Embedding your form on your website or blog is another way of reaching out to people. Use the code we have provided to embed your forms anywhere on your webpage. You can embed your form using:  iframe: This option allows you to embed the form as a ...
                                                                                      Wherever you are is as good as
                                                                                      your workplace

                                                                                        Resources

                                                                                        Videos

                                                                                        Watch comprehensive videos on features and other important topics that will help you master Zoho CRM.



                                                                                        eBooks

                                                                                        Download free eBooks and access a range of topics to get deeper insight on successfully using Zoho CRM.



                                                                                        Webinars

                                                                                        Sign up for our webinars and learn the Zoho CRM basics, from customization to sales force automation and more.



                                                                                        CRM Tips

                                                                                        Make the most of Zoho CRM with these useful tips.



                                                                                          Zoho Show Resources