Articles in this section

See more

Creating Pop-Up Forms on Landing Pages

Avatar
Taylor Glass
  • Updated
Follow

With SharpSpring’s landing page builder, you can edit the landing page's code to fully customize your website. This article will detail how to create a pop-up window with a form on your landing page.

Note: SharpSpring offers Professional Services to assist with custom coding. You must have code knowledge in order to use the information within this article.

The following user roles can create landing pages:

  • Administrators
  • Marketing Managers


Article Contents


Preparing the Landing Page

To create a landing page that utilizes pop-up forms, do the following:

  1. In SharpSpring's top toolbar, click
    Content > Forms. 
  2. Create or edit a form.
  3. In SharpSpring's top toolbar, click
    Content > Pages.
  4. Create or edit a landing page.
  5. Add a button to the landing page.
  


Click to enlarge.


Adding Form Code

Once the landing page has been created and readied, do the following to add pop-up form code:

 

  1. In the landing page's left panel, click Edit Content.
  2. Click the button that was just added.
  3. In the right panel, in the the Set a Custom URL field, type #popup.
  4. In the left panel, click Edit Code from the menu on the left.
  5. Click HTML.
  6. Paste the supplied HTML code anywhere in the HTML section.
  7. Locate the PASTE YOUR FORM EMBED CODE BELOW! text within the code.
  8. Paste your form's embed code between the PASTE YOUR FORM EMBED CODE ABOVE! and PASTE YOUR FORM EMBED CODE BELOW! text.
  9. Click Save.
  10. Click CSS.
  11. Paste the supplied CSS code into the CSS section.
  12. Click Save.
  


Click to enlarge.
 


Supplied HTML code for Step 6.
 


Supplied CSS code for Step 11.

 


Ready to Learn More?

Related articles

Comments

0 comments

Article is closed for comments.

Still didn't find what you are looking for?