Need a front-end posting system to publish user-generated content and display custom post types? Here's the solution. Enjoy custom post type publishing, searching, and more!
Are you planning to build a platform powered by users' submitted content? Or maybe a guest posting site? You just need the right tools to make it happen and ensure scalability. Today we're going to share a true story based on such a platform. Let's start!
About 8 years back, I worked on a project with Suspended Coffees, a non-profit organization focused on encouraging random acts of kindness. The brief for this project was simple: a raft load of features on a tiny budget! We didn't have funds for any custom coding or development.
The project needed a solution that would work straight out of the box. It included front-end publishing, custom post types, member database, and so on.
We chose WordPress to add custom post types from the front-end. Formidable had everything we needed. We're going to share those experiences (and mistakes), so that you can hopefully achieve better, in less time, and with less stress.
We wanted to utilize the power of user-generated content in the age of Web 2.0. Because user-generated content is not just a trend. It actually helps define Web 2.0 and isn't going away. It shaped our story of WordPress front-end posting for custom post types.
Google's definition of Web 2.0.
Getting started with front-end posting and displaying custom post types in WordPress
Have you ever worked on a project with this kind of requirement? Well, we had several ones! Our basic requirements included the following.
- New member signups
- Members to update their own listings
- The ability to be searchable, and
- Users needed to be displayed on a map
Allowing users to submit their own stories was also high on the wish list. With all of this user-generated content, admin moderation was going to be an essential feature too.
One example of user-generated content is a business directory map.
We did some research and discovered the Create Posts feature in Formidable Forms premium. This feature (in addition to the Views feature discovered later) covered everything we needed. So after a lot of planning and pre-sale questions, we took the plunge and started building.
Read more: Create a WordPress Job Board
Simplest first
Form settings to display a custom post type.
To figure out Formidable Forms for the first time, we decided it'd be good to start with the simplest features first. We figured this was the user-submitted stories. John Sweeney, the founder of the Suspended Coffees movement already had an active blog. He wanted the option to add guest posts from time to time.
Once we'd read all the Formidable documentation on creating posts or pages from a form, we were set to work. We set up a simple post submission form to allow guest blog/story submissions. It included fields for name, email address, post title, the story, category, and an image upload.
Read more: How to Setup Front-end Posting in WordPress
Formidable's Post Status feature
Two features surprised us immediately. The ability to create a WordPress front-end post in draft mode was the first. We set up an email notification so the site admin would always be aware of new submissions. Then these submissions could be checked before appearing on the site. This prevented any unwanted material from being published. We also loved that we could edit user-generated submissions. We could even format them and add images, change the post meta, just the same as with a post created in the back-end of the website.
The second feature that really caught our eye was auto-populating the category choice drop-down. We'd expected the set up to be a bit more involved in the first place. We'd also expected to manually update the form any time new categories were added. Not so with Formidable!
For this form, we didn't need to set up a custom post type. These submissions would be appearing in the main blog along with all the other posts. The first cup of coffee was still warm when the form was published. We tested it and tweaked the finer details within the next hour. This part of the project was completed much more quickly than we expected.
Building the member database
Encouraged by the early success, we decided to tackle the membership database next. The plan was simple: create another form that created posts in a custom post type. This time the form would include a lot more detail, allowing people signing up to include social media and website links, contact information, and a full write-up/promo of their café.
We didn't need any logged-in users or a profile builder. Hence, no complex user roles were required. Formidable handled the member database generation efficiently!
Form to submit & display custom post type with front-end posting.
It worked like a registration form for the café owners- with further reviews of course!
Utilizing a mapping plugin
We'd found a WordPress mapping plugin that could take address fields from a WordPress custom post type and display them on a map (Codespacing Progress Map). This was so we could not only build a great directory, we could also have a map view and search function to display all participating cafés. This is where a LOT of trial and error came in. While the initial build was quick, we soon realized our mapping plugin wouldn't do everything we needed, so we had to re-visit the search function later in the build.
Read more: How to Embed a Google Map With WordPress Form Submissions
Using a View to display custom post type submissions
The next challenge was to get the submitted data to look good in the created post. For this, we chose the "Customize Post Content" option to create a new View. Using some HTML along with the field shortcodes, we were able to display all the submitted details in a simple, custom layout that was easy on the eye. It even included a mini-map showing the location of the featured café.
With our custom post type set up, our form created, and the mapping plugin configured to accept the submitted addresses, we uploaded our database of members and made the site live. Display custom post type, here we go! Then we sat back and watched happily as new signups came in nearly every day.
Pro Tip: Don't make this mistake!
We had initially planned to use the search function in Progress Maps, so our original form used one long address field. After a LOT of work and frustration, we found it didn't work well for global searches. As many people would be searching for locations near holiday destinations or overseas family, we decided to switch things up and use the more powerful search and filter functions of Formidable instead.
At this point, we realized that having separate fields for town/city/state/country, etc. would allow us to filter results much more effectively. Our database of nearly 3000 participating businesses was exported as a CSV and because of the nuances of international addresses, it had to be manually edited. To split up these fields before re-importing the data was a nightmare job that took one very patient team member nearly 3 weeks! The lesson? It's easy to combine separate fields, so always start that way!
Making the user-generated directory searchable
By far the most taxing part of the whole process for us was the search function. Not because it's actually hard to do, but because of bad planning (See the Pro Tip above) and simple stubbornness!
Yes, you could search Views in Formidable, but we were newbies. So, we spent a couple of weeks going round in circles trying out 3rd party search plugins and finding issues with every single one we tried. Eventually, we admitted defeat and opened a support ticket with Formidable.
A View is the answer to search submissions
Views are simply a way to displaying form submissions in WordPress.
A Dynamic View is what we needed, showing both the Listing Page with ALL our entries. And the Detail Page showed the specific data for a single entry. Both the Listing View and the Detail View could be customized to show only the information we needed. (Too much info on the Listing Page could look messy.) The [detaillink] shortcode made entries on the Listing Page automatically clickable to take users to the individual listing.
Building the search form
The final step was to build the search form. We followed the guide and set ours up to allow filtering by country and state, as well as café name and address. We were amazed at how easy it was to find any entry we needed. Now our users could use the visual interactive map to browse participating locations near them or use the Formidable search for specific café names or locations. The two perfectly complemented each other.
A Formidable View search results for Suspended Coffees.
Displaying custom post type submissions
The Suspended Coffees project is pretty old now and another developer has since taken over maintenance of the site. It was a big challenge for someone completely new to Formidable, and this powerful plugin allowed us to achieve things with WordPress front-end posting that we hadn't thought possible. Since then we've gone on to use Formidable on all sorts of projects where a front-end edit screen was needed. We've even included it on some projects where it wasn't actually necessary, but the site owner simply found the Formidable Forms interface more user friendly than the WordPress interface.
Front-end publishing opens the door to user-generated content. It allows your visitors to get involved, while you build communities and the searchable directories to support them. If you need, you can create custom meta boxes, post types, and taxonomies as well.
Read more about WordPress custom post types
6 Easy User-Generated Content Examples
How to Display Form Submissions in an Image Carousel
How to Display Form Submissions in WordPress (3 Steps)How could displaying custom post types in WordPress change your online presence? How would a custom post type UI contribute to it? Share with us via comments. And yes, get started today with Formidable Forms to begin a new journey with user-generated content!
It would be nice if user can post/update content without "entry"
Requires entry linked to post is bit drawback.
If you know you'll never need to update the posts via the form again, there is a snippet of custom code that can be added to separate the post from the entry and allow editing as if it was created via the normal WordPress system.
Thank you
But actually I want to make posts that wasn't created by Formidale editable with Formidable as well.
So not editable isn't what I want...
That is also possible - although a little more complex to setup...
My story is exactly the same. From having used Dreamweaver almost exclusively, to using Formidable the first time when I took on a nonprofit website for a friend, to being excited at the challenge and learning it all.
Good for us and thanks for sharing!!
That's very similar to what we have for many years now.
We have campsites and outdoor attractions add listings. These are all geo searchable (I use GeoMashup plugin). It is also possible to then show nearby campsites and activities for families when someone is viewing a listing post.
We have extended that for What's On events, rotating advertising banners, and sorts of functionality - even a BuddyPress style profile powered by Formidable plus MyCred for member rewards - and families can post their activities which get published as a custom post type on the website.
Thank you so much ! It looks like the web site i'm trying to create !! Could you explain me how you used the data coming from your formidables forms in the map listing ? How did you make a link between Formidable and Progress Map ? I'm a real newbie !!!
Thank you !
I'll admit I was a complete newbie too, and it was a bit of a nightmare!
I had Formidable create posts - and Progress maps can list from posts, so it was just a case of formatting the address data in a way that progress maps could handle.
If you get stuck, browse the helpdesk & find my old tickets from before I was working here (You'll see just how clueless I was!) and you should be able to follow my steps there.
Thanks ! To make use i'm using the proper application, is it possible to use data, not from posts, but from forms that members fill in, to create a listing in Progress Map ?
I'm newbie on WP and not so good in english, so it's a bit complicated for me !! :-))
I'm not sure if Progress Maps can take data direct from entries - - but getting your Form to create posts is simple enough - there is a guide to the process here: https://formidableforms.com/knowledgebase/create-posts/
Ok, thank you so much !!
Is there a guide explaining what kind of post I have to create to use it in Progress Map ? pages . Custom posts ?
I used custom posts - but I believe Progress maps can work with any post type.
We don't have an in-depth guide to this integration yet unfortunately, but we are working very hard on adding to our documentation at the moment, so this may be added in the future.
Ok, thank you so much !!
Is there a guide explaining what kind of post I have to create to use it in Progress Map ? pages . Custom posts ?
This gives me some great clues about how what we're trying to do may work, but I have a question.
We want to take several pieces of information, and combine them into an entry in an "event" using Events Manager (which creates a custom post type). Would we be able to combine those various fields, and some HTML code using the Custom Post Content feature to add the content to in the event post?
Hi there, You can post your form entry data into a custom post type, but it may be worth chatting with our awesome support staff to make sure your setup will work the way you want. We can't provide in-depth support on our blog, but it sounds like it may be possible based on my understanding of your use case.