Technical Setup Overview

Part 3: Crowdsource and Share Your Community’s Stories

[00:00:00]

Technical Setup Overview

Brian: And that’s what we’re going to talk about today. So we’re not going to get too technical. We’re not going to get too in the weeds on this, but I will talk about our tech stack for this demo.

Um, we’re going to be working with, uh, WordPress of course, and we’re just going to use the free 2024 theme, um, as just the theme, it’s not really. Important what theme you use your website probably has a theme already, but this is just, um, to let you know, that’s what our demo is and how nice this kind of stuff and how professional it looks with just stock WordPress and the default theme, we’re going to have gravity forms installed.

Of course, we’re gonna have gravity forms, advanced post creation installed, which is a plugin. That’s going to let us, um, take that. Content and do something with it. And then I’m going to have two additional plugins that I’m going to show you that I think are really cool and helpful, but are not necessary at all.

And they’re both free WordPress plugins. One is called CPT UI, and it’s going to let us make a custom post type, which we don’t have to do, but we’ll see why it’s kind of helpful. And the second is a plugin that I love called public post preview that we’ll [00:01:00] take a look at and how it can help you, um, get through the process of maybe editing and previewing your content before it goes live on your site.

Demo: Setting Up Story Submission Form

Brian: Let’s jump into the demo and look at what this sort of can look like for your users. So here I have just a WordPress development site that I’ve set up. It just has the stock 2024 theme. It just has a bunch of kind of placeholder content throughout. Um, this part is not really important. It just is the way that WordPress sets it up for you.

But what we’ve done on the site is we’ve set up a page. Archive of stories. And this is a place where this will be kind of automatically generated, but it’ll collect all of your different stories as they get published to your website and people can browse them just as if they were posts in a blog. And then second, we’re going to talk about this form right here, which is really the most important part, which is the ability for somebody to share their story with you quickly and easily.

So. [00:02:00] This is a gravity form, and this is all you’re asking for your, um, for your user to do, which is to fill out this form and give you some basic information, your first and last name, their email address, obviously, to, um, keep track of them, give their story a title, um, we put it as required, but it’s, uh, Something you might edit later on once you see the actual story, um, an image for your story if they have an image not required, because often that becomes a bit of a barrier and then just a big text box where they can paste it.

Um, and finally a checkbox where we. Want to ask them for consent. This will, this is, uh, something you’ll kind of clear with your own sort of legal department, but like you might have, um, some rules about making sure that you just get their permission to use their story. Even though they fill out the form, it always helps to have this consent field that just says, Hey, I.

Giving you permission, you’re going to share the story on the website, on your newsletter, maybe on your social media. So, um, it’s really critical that you get that. Um, there are [00:03:00] some additional options that we’ve done. Sometimes we have an additional box that says, uh, share my story anonymously. And that’s.

Because sometimes people want to share their story, but they don’t want their name attached. So if that’s something you’re interested in, you can also add an anonymous field that says, Hey, can you share this story anonymously? So this is our basic form. Now this page itself is pretty, um, Bland, but what I would recommend is as you’re building out a page like this, you would actually use the area above your form to add a lot of content, such as, um, some tips, some guidelines, some links to example stories, um, and maybe even embed, you know, a quick walkthrough video or something like that, but, you know, definitely use this page to make your user feel really safe and secure.

Give them some good advice, give them some, um, uh, texts and also just let them know that once they submit their story. Your team will be reviewing it before it goes live on the website and that it will not be published immediately just so that they’re, uh, [00:04:00] aware that that’s going to be the case. So use this area to, to really make this, um, the most inviting page you can.

And so let’s take a look at the backend of our site and the form that we built and kind of how easy it is.

Advanced Form Configuration

Brian: So let’s jump into the backend and we’ll head over to our forms. And you can see, I’ve already added the form and the form is called add your story. So when I added this form, I only added really those few fields that we looked at.

So we have our name field, and this is just a standard gravity forms name field. Um, the email field, this is just the standard. Gravity forms, email field. We’ve made it required. Um, and we’ve also checked the box here that says, you know, confirm their email. Cause we really want to make sure if we don’t get their email correct, then, um, you know, we won’t be able to kind of get back to them in case we want to make any changes.

And then this is where we start adding these custom fields from this add on that we’ve installed called. Advanced user or advanced post creation. So let’s [00:05:00] scroll down here and you’ll see this section here called post fields. So these are the fields we’re going to use. And they’re there, they look similar that they look just like a text field or a text box field.

The difference is, is that they already include all of the plumbing kind of required, so we’re going to add these fields to our form. So that way we can say, Hey, we want to let them set the title. We want to let them set the body and we want to let them set the post image. And that’s, that’s basically it we need for this.

I have seen some advanced implementations where we give them some category options. Like, are you a. Um, you know, are you an advocate, are you a volunteer, you know, if you want to categorize it further, um, but we won’t go through that in this example. And so all we need to do here, what’s really important, um, is that we just give our field a name, like, you know, the title of your story, something like that.

You can give them some additional description, maybe let them know, Hey, it doesn’t have to be final. We can edit this later, that sort of [00:06:00] thing. Um, and then we’ve set the post status here to pending review. So, uh, we’ll take a look at what happens when an actual post gets created. But the goal here is that we want this post to be, um, under review.

We don’t want it to be published immediately. So it’s really important that we keep track of that. So we’ve done that. We’ve added the post image to give them an option to add a featured image. And we’ve given them this body field, which is basically is the body of their story. And so this is where they’ll do most of their work, just publishing their story.

Sometimes in the instructions, we say, Hey, use something like word or Google docs to, you know, draft your story ahead of time. Come back to this form when you’re fully ready. Uh, don’t actually write the form. Story in here, maybe write it ahead of time and copy and paste it here. And then finally, we’ve added this consent field, which offers a yes or no checkbox, and we are explaining to them, you know, what they’re agreeing to by giving us this information, and then we’re requiring it.

So it’s really [00:07:00] important to, uh, make sure that you just collect some sort of consent just to make sure that, you know, you have no, uh, no, um, culpability if, if they get upset about it. Um, and also if somebody asks you to take in their story, you would of course agree to do that. So that’s building out the basic form that we saw on the front end.

Now, where does this information go in Gravity Forms? Every time someone submits a form, there’s always a backup saved under the form entries. So that’s one thing to keep in mind. Already, we know that with Gravity Forms, you have that extra security of, okay, my, my copy of my form is saved. So that’s super handy.

Um, it’s really great to be able to go back and look at forms just to make sure. Um, but the second thing is that we’ve installed this plugin called CPTUI. This is a little bit of an advanced trick here. And it’s definitely optional. So when you use this by default, when somebody submits a story, the default place where, uh, Gravity Forms will place it is in your posts with all of your other blog posts.

And that’s actually fine. You can definitely do that. You can [00:08:00] maybe even set up a post category called stories or something and, and have them automatically assigned there. And that, that works really well. Some. Some sites, um, want a little bit more control over how their stories are displayed. So in that case, that’s when we recommend a tool called CPT UI.

And what this does is it lets us make our, our own post type. And I’m going to pull up the example right here and I’ve named it advocate stories. You could name it whatever you want, but it just shows up here as a separate from your blog posts. And so stories. We’re giving it basically a separate place to live so they don’t show up with your normal blog because maybe your normal blog has news and updates and, and, and more informational stuff about your organization.

This becomes its own little section of the website by using this custom post type. So we’ve made this custom post type called stories and we’ve just filled out some fields. There’s a bunch of other fields here. Uh, we’re not really concerned with any of this. We just left it all to the defaults. Um, but we just wanted to give it another place to live and that’s completely optional.[00:09:00]

So let’s go back to our form and now let’s head over to the settings. So once you’ve populated the kind of visual layout of your form, the last step is really to go through all of your settings. What’s really important here is number one, what is the confirmation that they’re going to receive? This is just some text that appears after they’ve submitted the form.

So you might want to come in here and edit this default text to let them know, Hey, we do review stories. It takes us a few weeks, something like that. Second, you might want some notifications. You can have a notification that goes out to the person. That’s just an extra email. Hey, we got your story. Here’s a copy of it, something like that.

And then an email notification to whoever’s the administrator of the site. So they can also know, Hey, somebody submitted a story. Uh, it’s time to go and take a look at it. And then lastly, this is a new section that’s added because of our, uh, additional plugin, which is. But this is the post creation feed.

And so when you come in, there won’t be anything here. And to get this [00:10:00] kind of all connect and work, it’ll be your job to come in here and create a new feed, which I’ve already done. And so I’ve created a new feed. And what a feed is, is basically. Once a form is submitted through gravity forms, do something else afterwards, do something with all that form information.

And so we’re going to create a post. Now you can create it as a post, like I said, but what we’ve done is instead of making it as a post, we’re making it as our own custom advocate story post type. Um, what’s important here is that you set the status again, just to be sure, uh, to pending here as well. I like to make sure it’s set here cause this is kind of the global spot.

You do not want it to be set to publish because you do not want somebody to be able to fill out a form and immediately see content on your site. Um, it’s really something you want to put as pending or draft so that you can know that you need to review it before it’s visible. We’re actually going to allow comments.

Um, that’s another great thing is leaving comments turned on on these story posts and [00:11:00] other people will comment and, and sort of build that sense of community. And then there’s this post content and it’ll automatically be populated, but essentially they’re going to pick. The different fields from our form.

So our story title has been added to the title field and our story body content has been added. And then I’ve done this extra work right here where I’ve added a little line to say who wrote the story. So, you know, this story was shared by, and then we pulled in using these kind of merge tags right here.

The first and last name of the person who submitted their story. And so this gets added to the bottom of the post content. So that way at the bottom of the blog post, you can see who wrote the story. Um, there are some advanced things you can do with the custom fields, but, uh, outside of the scope of this, um, demo, and then we just save the settings.

So that’s, what’s kind of really important here is we save all of these settings.