You can harness the power of user-generated content with your WordPress site. Display a front-end form that your visitors can use to submit articles, pictures, or any type of posts to your own site. The easiest and most dynamic way to display such a form is to use Gravity Forms plugin. (That’s why it’s the solution I’ll use in this tutorial. However, it’s not the only solution and it’s not free. There’s the free User Submitted Posts plugin and a demo of it here.)
The form that I’ll create in this tutorial will have fields for the title, body, featured image, categories, and tags of the post. Posts which are submitted through this form will be marked “Pending Review”. It’s up to you, however, if you want the posts to be saved as drafts or be immediately published.
The form will also ask for the visitor’s name, email and website.
Here’s how the final thing will look like and work:
Oops! We could not locate your form.
The submit button is intentionally disabled because this form is for demo purposes only. However, when a visitor submits an actual form, the submission will be stored in the database, and you can, optionally, have email notifications sent out.
So, let’s start building this form.
First, download and install Gravity Forms. Next, in WordPress admin, go to:
Forms â†’ New Form
Make the General Form Settings
Youâ€™ll wanna adjust the general form settings. You do that by clicking on â€œForm Settingsâ€ at the top.
Give your form a title and a description.
Then go to the â€œAdvancedâ€ tab and configure the form submit button, its label, and whether itâ€™s a standard button or an image. And adjust the rest of the settings as you see fit. Every field in Gravity Forms has a little clickable question mark icon next to it that explains what the field does.
Inserting Post Submission Fields
Next, you’ll wanna insert the fields that will receive post data. Gravity Forms groups these fields in the Post Fields box.
In the demo form, I used the title, featured image, body, category, and tags fields. Inserting them is just a matter of point and click.
Each field has its own particular properties that you’ll want to adjust. For example, the post title field allows you to select the default status and author of submitted posts.
In the category and tag fields, you can limit the categories and tags to which the visitor can submit.
Paginating the Form
At this point, we’ve collected the essential data related to the post. Now we wanna create a second page in the form, where the user is supposed to enter their name, email address, and website URL. To do that, we click on Page Break in the Standard Fields box.
This will insert three new elements to our form builder: start paging, page break, and end paging. You can edit “start paging” to set the type of paging indicator (i.e. progress bar or steps), and set the titles for your pages.
You can also edit the text that appears on the “Next” and “Previous” buttons by editing the page break and end paging fields. You can even choose to use an image button.
Inserting Name, Email, and URL Fields
On the second page of the form, we’ll wanna insert fields to collect the submitter’s name, email, and URL. Again, Gravity Forms makes this so easy.
You’ll wanna go to the Advanced Fields box, and click on Name, Email, and Website. Make sure that these fields are inserted after the page break. These fields also have their own properties, edit them to your liking.
With that, the form is complete. You can now save it.
Displaying the Form to Visitors
Your form can appear any where you’d like, on a post, a page, or in the sidebar. To insert it in a post or a page, use shortcode for the form. Something that looks like this:
Oops! We could not locate your form.
You can find out the appropriate shortcode by going to the post editor and using the insert form button.
Alternatively, you could place the form in your sidebar by using the Form widget, which is another feature of Gravity Forms.
That’s all there is to it. As you can see, with WordPress and Gravity Forms, you can easily allow your visitors to submit articles, pictures, and anything you’d like to appear as posts. If you have questions or suggestions, let’s talk about them in the comments!