How to insert a form into your Posts, Pages and sidebars

What is Form Embedding?

Form Embedding is the term used for adding a form to a page, post or sidebar using shortcodes and widgets. There are a number of ways to get your form(s) into your post(s), page(s) and/or sidebar widget(s) and diffrent ways to display your forms. This will be all be covered in this section.

How to embed a form

1. Click on the Embed Tab from the top nav.

2. You will find the available shortcodes and PHP template embed codes.

3. Copy the shortcode and paste into your pages(s) and/or post(s). Copy the PHP code and paste into your Theme Template page(s)

The NEX-Forms Shortcode

The normal NEX-Forms Shortcode is simple and easy to use in your pages to display forms inline.

[NEXForms id="1"]

In the shortcode NEXForms specify that its a form insert and the id parameter specifies which form. In this shortcode the form with the ID 1 will be inserted. You can get any Form ID from your forms panel.

Note: shortcodes are case sensitive

Using the Shortcode for a Popup Form

The Popup Form Shortcode allows you to use a number of option to popup a form.


Shortcode for a normal Popup from a button

[NEXForms id="1" open_trigger="popup" type="button" text="Open Form" button_color="btn-primary" ]

id
Tells the shortcode which form to popup.

open_trigger
Tells the shortcode that this form will be a popup and not inline.

type
Tells the shortcode that this form will popup from a link or a button. In the above shortcode the form will ppopup from a button.

text
This is the text that will be on the button.

button_color
The class used for the button's styling. You can use any custom CSS class you want here.


Shortcode for a normal Popup from a link

[NEXForms id="1" open_trigger="popup" type="link" text="Open Form" ]

id
Tells the shortcode which form to popup.

open_trigger
Tells the shortcode that this form will be a popup and not inline.

type
Tells the shortcode that this form will popup from a link or button. In the above shortcode the form will ppopup from a link.

text
This is the link's text.


Shortcode for a normal Popup from a custom element on your page

[NEXForms id="1" element_class="your_element_classname" ]

id
Tells the shortcode which form to popup.

element_class
Tells the shortcode what elelemnt on the page will be used to trigger the popup form. Use the element's CSS classname to identify it.


Shortcode for a Auto Time Delay Popup

[NEXForms id="1" open_trigger="popup" auto_popup_delay="10"]

id
Tells the shortcode which form to popup.

auto_popup_delay
Tells the shortcode how long to wait for the form to auto popup in seconds. In the shortcode above the form with Id 1 will popup after 10 seconds from the the time the user entered the page.


Shortcode for a Scroll Position Popup

[NEXForms id="1" open_trigger="popup" auto_popup_scroll_top="800"]

id
Tells the shortcode which form to popup.

auto_popup_scroll_top
Tells the shortcode to auto popup the form when the user is at a certain scroll position in pixels on your page. In the shortcode above the form with Id 1 will popup when the user scrolled 800 pixels from the top of the page.


Shortcode for a Popup when the user leaves the page

[NEXForms id="1" open_trigger="popup" exit_intent="1"]

id
Tells the shortcode which form to popup.

auto_popup_scroll_top
Tells the shortcode to auto popup the form when the user leaves the page.

Note: shortcodes are case sensitive

Adding forms using the Sidebar Widget

This section explains how to add forms in difrent displays in your theme's siderbars.

How to insert an Inline Form Widget

  1. Open WordPress Widgets found under Appearance in your wordpress menu.
  2. Drag the NEX-Forms widget into a desired Sidebar
  3. Select the form to insert
  4. Make sure "Sticky" and "Popup" are set to "No"
  5. Click "Save"

How to insert a Sticky Form Widget

  1. Open WordPress Widgets found under Appearance in your wordpress menu.
  2. Drag the NEX-Forms widget into a desired Sidebar
  3. Select the form to insert
  4. Select "Sticky" to be "Yes"
  5. Enter the text to be displayed on the paddle (keep it short)
  6. Select one of the twitter bootstrap or google material design colors to be used for the paddel
  7. Select The position of where the paddle should appear: Top, right, bottom or left.
  8. Set "Popup" to "No"
  9. Click "Save"
NOTE: When using sticky forms make sure to use small forms. Also make sure to add the fields of the form into a panel for display purposes.

How to insert a Popup Form Widget

  1. Open WordPress Widgets found under Appearance in your wordpress menu.
  2. Drag the NEX-Forms widget into a desired Sidebar
  3. Select the form to insert
  4. Select "Popup" to be "Yes"
  5. Select display to be a button or a link.
  6. Select one of the twitter bootstrap or google material design colors in case of a button
  7. Ebter the Button/link text
  8. Set "Sticky" to "No"
  9. Click "Save"

Adding forms using the TinyMCE Page/Post Editor

This section explains how to add forms from the TinyMCE Editor(WordPress page/post Editor).

Adding an inline form to your page

  1. Create a new or edit an exsiting page or post
  2. Place your cursor where you want the form and click on the NF button as per the graphic below:


    A popup will come up with embedding options:

  3. Select the form to insert
  4. Select the form to display Normal (not Popup)
  5. Click "Ok"
  6. The shortcode will be generated in your page or post were you placed your cursor


Adding a Popup form to your page

  1. Create a new or edit an exsiting page or post
  2. Place your cursor where you want the form and click on the NF button as per the graphic below:


    A popup will come up with embedding options:

  3. Select the form to insert
  4. Select the form to display Popup (not Normal)
  5. Set the popup settings (see popup options below)
  6. Click "Ok"
  7. The shortcode will be generated in your page or post were you placed your cursor


Popup Options


Auto Popup Time Delay (in sec)
Set the time delay in seconds for when the form should popup from the time the user enters the page. Leave blank for no effect.

Show Popup on Exit Intent?
Choose to popup a form when the user exist the page.

Auto Popup when scroll from top is (in pixels)
Set the scroll poption from the top of the page in pixels where the form should auto popup. So when the user hits this scroll position from the top the form will popup. Leave blank for no effect.

Popup/Modal Trigger
Choose Button, Link or Custom Trigger.

Enter Element Class Name
If you are using a custom trigger then enter the element's class name here. Leave blank when using a button or link trigger as per above.

Button Color (bootstrap)
Choose the color for your popup button. Not applicable for custom or link triggers.

Button/Link Text
This is the text that will be your link or be displayed on your button. Not applicable for custom triggers.