In this blog post, we’ll use the user submitted posts WordPress plugin to enable your website visitors to submit posts from the front end of your WordPress website freely and securely. You can also accept user-generated content from the frontend in Elementor by use of shortcodes provided by this plugin.
Note: the digits in brackets e.g. (00:02) indicate the minutes of that exact explanation in the video so you can easily jump to that section and follow along.
Video: Submit Posts from Frontend WordPress Tutorial
Set Up User Submitted Posts WordPress Plugin
On your WordPress dashboard go to Plugins > Add New, search for the User Submitted Posts plugin then install and activate it (01:55)
After activating the plugin, go to your installed plugins and find it, click on settings (02:09), here is where you set up what information you want to collect from anyone who wants to submit content on the front end of your website.
On the User Name, User Email, Post Title, Post Category, Post Comment, and Challenge Question options; select enable and require.
Disable the User URL, Custom Field, and Google reCaptcha options.
Enable but do not require the Post Tags, then enable the Post Images option (03:00).
Scroll down to the General Settings to make some more settings:
Make sure the Post Status is set to the default Pending option, make sure you have your Success message set, and make sure the Rich Text Editor is enabled so that people can be able to edit their posts. Also, make sure the Terms and Conditions checkbox is enabled.
Under Categories & Tags; enable the Categories and Multiple Categories options.
Down on the Challenge Question option; add a challenge of your choice, and under Challenge-Response add your answer.
You can enable Email Alerts if you want, to make sure you’re notified whenever there’s a new post.
And on the Image Uploads option, you can set the submitted images as Featured images, and you can set the maximum number of images to submit, as well as the image dimensions.
Leave the rest of the settings on default, then click the Save Settings button.
To Read: How To Import An Ms Word .Docx Into WordPress Posts And Pages
Create a Page and Add a Form
Go to your Pages section on your dashboard and Add New, give your page a name (mine is Frontend Submission), click the Publish button then you can preview your page (06:39)
Back to your User Submitted Posts settings, go to the Display the Form option, copy the form shortcode (06:51).
Back to your Page, click the [+] icon to add a new block, search for the shortcode widget and add it, then paste your form shortcode in it (07:02)
Click the Update button and then preview.
Now, we have to enable the form to reset after someone submits a post and to be able to view the list of submitted posts.
Back to your form shortcodes, Reset Form Button option and copy its shortcode (07:50)
Back on your page, add another shortcode widget and paste the code.
Then go to the Display Submitted Posts option and copy the shortcode, in your Page add another shortcode widget and paste the code (08:14)
When you’re done, update and preview your page. And now there’s a reset form option and submitted posts.
Go back to your page, add a heading block and name it ‘Submitted Posts’, make it H3 and bold, then move it above the display posts shortcode (08:57).
Update and preview.
To test out the form submission, copy the URL and go to a different browser, paste it then feed information into your form, and when you’re done submit it.
Note:
After someone submits a form, there’s no form left to fill, so for another to use it, they’d just have to press the Reset form button then the form will reappear.
To view the post, go to the backend of your website (on your dashboard), go to Posts and you’ll find a new pending post (10:52), and you can view the details like the author, categories, tags, and the date.
When you preview the post, you’ll see that it has the uploaded image as the featured image, and all the content submitted is there.
If you want to approve the post, click on the Quick Edit option, under Status change it to Published and the update.
On your front end, when you reload your page, this post will appear under submitted posts.
Also Read: How to Create a Single Elementor Blog Post Page Template
In Conclusion
That’s how you can enable frontend user submission of content. You can also do this in Elementor by adding your shortcode in your Elementor editor.
For any questions, comments, or suggestions, let me know in the comments section below.
Subscribe to my newsletter and youtube channel for more tips and tutorials.
