Skip to main content

Working with Inline Forms

Embed a form box inline with the content of your page.

Written by Cassandra Campbell

An Inline Form is embeddable and displayed directly within your webpage, appearing as part of the main content (i.e., inline with the content). They are a strong fit for blog posts, landing pages, or anywhere you want the ask to feel like a natural part of the page instead of attracting focus.

For example, only the form fields are part of a native BDOW! campaign form. The rest of the content is the webpage itself.

Creating Inline Forms

An Inline Form is one of the presets in your design tool. Start by creating a new campaign form in your BDOW! site manager.

  1. On the Form Type tab, select the Inline Form option.

  2. On the Design tab, decide whether you would like to enable Inline Focus. This is a feature unique to Inline Forms that will darken the background as the form scrolls into view.

  3. On the Visibility tab, disable Smart Mode. Embedding is an advanced feature that is not available when Smart Mode is enabled.

  4. You will now see the the code for your Inline Form. Simply copy the embed code, go to your site's editor, and then paste the code into the HTML. Basically, you will be treating the campaign form like any other element on your site.

The form will not appear until you publish the BDOW! campaign form and publish the changes to the website itself. Make sure to save in both places!

Automatically embedding the form

Rather than directly pasting the embed code into your site, you can have BDOW! automatically embed the form. It works similarly to the "where to display" of a Scroll Box, so this is a nice feature when you do not require precision placement and a relative position will work.

To do so, just enable Auto Mode and specify the relative location down the page.

Embedding an Inline Form in WordPress

Some of our customers have previously run into issues when adding an Inline Form embed code to a WordPress site. This is due to the editor in WordPress, but there is a way to get it working.

When switching between Text view (where you place the embed code) and Visual view in the editor, the embed code disappears. To prevent this from happening, follow the following steps:

  1. Copy your Inline Form embed code in the BDOW! design tool.

  2. Go into your WordPress Dashboard.

  3. Find the page or blog post you where you would like to embed the campaign form, and Edit it.

  4. Make sure you're in the Text tab within the editor, then find where you want to place your Inline Form.

  5. Paste in your embed code.

    texteditor.png

  6. To prevent your embed code from disappearing when you switch to Visual view, modify it to include style="display: none;" as an attribute in the span tag, then include ADD_THIS_TEXT in-between the opening and closing span tags. It will look like this:

    wpfix.png

  7. Finally, just save and publish.

Troubleshooting your Inline Form

Here are some steps you should take if your Inline Form is not appearing on your site:

  1. First thing you should check is that BDOW! is installed on the site where you wish to display the campaign form. Are other forms appearing, or is it just this one that is having an issue?

  2. Next you should check if your form is Published and Active.

  3. Ensure that you're not using any AdBlocking software and that you have cleared your browser cache.

  4. Verify that the live site has the proper embed code. You can test that by navigating to the page where you inserted the Inline Form and inspecting the form element. It should have the same code provided in the BDOW! designer.

  5. If you are using the WordPress text editor and the form is not showing up, check if the form code disappears in the editor after making any changes. If so, see the dedicated section above on embedding in WordPress.

Have more questions?

  • You can browse through more of our help docs at https://help.bdow.com/

  • Reach out to our Customer Success Team at [email protected]

  • Tinker a bit. You can create copies of your form to play with on a random page of your site. This way you not only get to react to your forms as your customers do, you also get to see the power of BDOW!. It's your form, have fun with it!

Did this answer your question?