WordPress is the most popular content management system in the world. It started out as a platform exclusively for blogging but has grown and advanced significantly over the years. As of January 2015, WordPress was used by more than 23.3% of the top 10 million websites.
JotForm strives hard to make sure that forms will work for the most popular CMSes on the market. For WordPress users, putting your form into a post or page takes just a few steps. The three ways to do this are:
Using WordPress Embed Form Plugins.
Using our WordPress embed method
For hosted WordPress.com users, using the embed method.
Using WordPress Embed Form Plugins
For WordPress.org users, you install our embed form plugin, and then use shortcodes to embed the form. First install the plugin: https://wordpress.org/plugins/embed-form.
a. Login to your WordPress Admin Panel
b. Click Plugins > Add New option
c. Search for Embed Form in the search bar. The developer that will appear should be the one from Ertugrul Emre Ertekin, our CTO.
d. Click the Install button
e. Make sure to activate the plugin
f. In your WordPress post/page, you will see the JotForm pencil icon.
As long as you are logged into your JotForm account using the same browser, clicking the icon will popup a window where you can select the form you’d like to embed.
Note: If you are using WordPress’s latest editor, Gutenberg, you must add a Classic block to your post or page to be able to add a form using the JotForm icon.
g. Clicking the Select Form button after checking the form will add the shortcode into the post/page:
h. Save the page and that’s it, the form is now embedded to your post/page.
We also have an oEmbed Plugin: https://wordpress.org/plugins/jotform-oembed/. Simply install the plugin by following the same steps above.
Get your form URL by clicking the Preview button in the Form Builder
Paste the form URL in the WordPress post/page and the oEmbed plugin will automatically detect the form and embed it to your page/post.
When pasting the form URL:
When the form is finally loaded/embedded in the post/page:
For Feedback forms, you can install our Feedback Form Plugin: https://wordpress.org/plugins/jotform-feedback-button/.
After you install and activate the plugin, simply go to Settings > JotForm Feedback Button:
After saving the changes, you will now see the feedback button in every post/page of your website:
Using our WordPress embed method
If you prefer not to use a plugin, you can also embed the form to your post/page using our embed methods.
In the form builder, click the Publish button. Open the “Platforms” tab and search for WordPress.
Select which WordPress from the list is appropriate in your case.
If your website is self-hosted using “WordPress.org” files, then follow the instructions listed under the WordPress.org option.
In your WordPress post/page, click the Text option. Paste the embed code.
If for some reason the WordPress Embed won’t work, we recommend using our iFrame method: https://www.jotform.com/help/148-Getting-the-Form-iFrame-Code.
Sometimes it may run into a JavaScript conflict with other code on the page, for instance.
Using the embed method with WordPress.com
For WordPress.com hosted websites adding a JotForm form is as easy as placing tags around your form's URL within your post.</p><p style="">Or you can follow the steps mentioned in the publish wizard, make sure that you are seeing "WordPress.com".</p><p style=""><img src="https://shots.jotform.com/charlie/Guides/Wordress_JotForm_Embed/wordpress_jotform_com.png" alt="" width="640" ><br></p><p style="">While in the Text mode editor, you can paste the form enclose with an embed tag:</p><p style=""><span data-mce-style="background-color: #ccffcc;background-color: #ccffcc" style="background-color: rgb(204, 255, 204);background-color: rgb(204, 255, 204)">http://form.jotformpro.com/form/31362999175971
If your intention is to only have a form on the page, simply copying and pasting the URL on the post body is also enough. WordPress.com will turn it into an embedded form.
And that’s it for WordPress.org self-hosted and WordPress.com hosted websites. If you have any questions, comments or suggestions, please feel free to post it in the comment box below or contact us on our support forum.
Send Comment:
Comment: