With embedded form, you can show your Onsite form as an integrated part of your website by adding a single line of code to your website on the page where you want the form to display.
Creating an embedded form in our builder is just like setting up popups or slide-ins.
Click "New onsite pop-up" in your Onsite dashboard and choose one of the templates in the "Popups" category (these can all be embedded).
Note that Sticky Bar and Sidebar templates cannot be used in the embedded position.
Once you select a template, continue to the Positions step. Here, choose "Embedded" and click "Continue":
Next, you can fully customize the design of your form to your liking by changing the colors, editing the text, adding more input fields, and so on.
To reach the best design possible, we recommend adjusting the “Preview Width” to the width of the element on your page where you plan on implementing the form. You do this by either typing in the width in pixels in the “Preview Width” box, or by pulling the resizing handles like this:
When you’re satisfied with your desktop and mobile design, continue to the "Display Settings" step. Here you will get the line of code that you need to insert on your website. Click “Copy desktop/mobile snippet” and open up your website backend in another tab.
🚨If you want to use your own Placeholder ID, make sure to change it both in the desktop and the mobile section. Otherwise, if you will be using the Placeholder ID provided by us, you only need to implement it once on your website (as the mobile ID matches the desktop one).
💡Also note that Page-Level Targeting and the Targeting Options still apply even though the form will show as an embedded part of your website, so you can still use the different options to target the right audience on your website (such as new visitors or existing subscribers.)
How to Add the Embedded Form to Your Site
Adding an embedded form to your site is easy, but the method changes depending on your CMS platform or website solution.
For example, if you're a Shopify user, you can edit your theme, add a Custom HTML block, and paste your form snippet into it:
Or, if you're using a WordPress editor, you can simply paste the form snippet into an HTML block, like this:
Remember that your Drip script also needs to be added to the website where you want to display your form (if it isn't already there).