The most common signup forms you find on websites are inline forms. Those are the ones that are embedded to website pages, blog posts, sidebars, or footers. Unlike popup forms they appear as natural part of the web page and are displayed at all times.

How can you embed such an inline form to your website? By adding two code snippets. 

It's easier than you think. Let me prove it to you!

Start with creating an inline form. This help center article walks you through the steps of how to create and customize your form.

At the end of the form customization steps you will get two code snippets. It will look something like the below image. You need to add these codes to your WordPress website so that the form gets displayed and your subscribers can sign up.

Note: both the so called header code and the inline code has to be added to your website. It is not enough to add only one of them.

How to add the Header code to your WordPress website

You can add the header code either with the help of a plugin or manually. 

Adding the header code with a plugin

The easiest way is to install a plugin from the Wordpress plugin library that helps you add code snippets to your website’s header and footer section. If you already have such a plugin jump to Step 5—otherwise follow these steps first. 

Step 1. Login to your Wordpress Dashboard

Step 2. Go to Plugins > Add new. It will look similar to the below image.

Step 3. Run a search for the ‘Insert Headers and Footers’ plugin in the Search plugins... field on the top right. 

Step 4. Click on Install now next to the ‘Insert Headers and Footers’ plugin then Activate the plugin.

Once you’ve installed and activated the plugin it will appear under Settings.

Step 5. Click on the Insert Headers and Footers plugin on the left side panel—see example screenshot below—and paste the Flodesk header code to the plugin section that hosts the Scripts in Header.

Step 6. Save your changes.

Adding the header code manually

This is an advanced method and would require you writing code directly into your theme’s functions.php file.

Learn how to add code to your theme's functions.php file here.


Once the header code is added to your WordPress website—either via a plugin or manually—the next step is to add the inline code where you want the form to show on the page.

How to add the Inline code snippet to your WordPress website using the Genesis eNews extended widget

The second code snippet is the inline code. You have to copy and paste this code where you want your form to appear on your webpage.

For the Genesis eNews extended widget you need to click on the Advanced Options, found at the bottom right corner below the inline code.


 On the next screen select the Get Genesis eNews snippets option.

Use the Copy action next to each field and then paste the values to the corresponding Genesis eNews widget fields. Once done, click the Save button on your widget.


Let's sum it up

How to add an inline form to your WordPress website with Genesis eNews extended widget:
To embed an inline form to your WordPress website you have to add both the header code and the inline code to your website.

You can add the header code with the help of a plugin in WordPress or by adding the code directly into your theme’s functions.php file. 

The inline code goes to Genesis eNews widget where you want the form to show on the page.

More to learn:

Did this answer your question?