Moderating user generated content

You may want to allow user-submitted content, but you want the content to be approved by an administrator before it appears on your site. 

Updated over a week ago

📌 Note: Custom fields are available as add-ons. For more information on adding new features please see the add-ons page in your nation.

Table of Contents

Moderating user submitted events

Use page tags to easily moderate user-submitted events. Page tags can segment out approved and un-approved events and only publish authorized events. To get started, simply create a Calendar page at Website > [name of website] > + New Page.

Then in Calendar Settings > User submitted events check the box that says "Allow people to add their own events" to allow people to add user-submitted events. Click Save settings

Under Calendar Settings > Basics, find the box labeled "Only include events with one of these tags." Set that box to include events with the tag "approved".

When a user submits a new event through this form, it won't have the "approved" tag by default. When a control panel user adds the "approved" tag the user-submitted event will be visible on your site. This will ensure that only approved events display on your site. To see incoming events, go to your Dashboard and view Activity to you can see a stream of all user generated events.

From there, click the name of the event, then Settings > Page settings, to see if you approve of this event's content. If you approve, just add the tag "approved" to that event, and it will show on your website.

Hiding unapproved events from view

Following the instructions above will prevent anyone who visits your website from viewing the unapproved calendar, but a person can still link to user-submitted event page. You can prevent having unapproved events accessible by making a change to both your pages_show_event.html and pages_show_event_wide.html in your theme files. You must have a custom theme to make these changes.

In the two theme files, create a list of your page's tags by placing this code at the top of layout.html:

1{% assign tags_list = "" %}

2{% for tag in page.tags %}

3{% assign tags_list = tag.name | append: ", " | append: tags_list %}

4{% endfor %}

Then, wrap the content in an if/then conditional that checks for two things:

  • page is user submitted

  • page has 'approved' tag

Your code on both pages should look something like the code sample below:

1{% if page.is_user_submitted? and page.tags contains "approved" %}

2...original page template...

3{% else %}

4<p>"The page you're looking for could not be found."</p>

5{% endif %}

Moderating user submitted blog posts and suggestion

Moderating user-submitted blog posts or suggestion box submissions takes a little more work than user-submitted events. You will have to use Liquid in the page template to display a form from one page of your website on another page using the {% subpage %} Liquid tag and a partial HTML template. Learn more about these techniques.

First, make two blog pages: one for displaying blog posts, and one for accepting blog posts. This creates two separate "buckets" for your posts. One will be the "approved" blog that will be visible to your website visitors. The other will be private and hold all "unapproved" posts. A good nomenclature for these two pages page slug's might be blog and blog_unapproved.

Go to your "approved" blog. This is the one you want to be public. Go to Blog page > Template. Remove the code for user-generated content which should start with {% if page.blog.is_posting_public? %} and end with an {% endif %}. This often spans from line 8 to line 41, but could vary in your template. It should look like the snippet below.

01{% if page.blog.is_posting_public? %}

02<div class="padbottommore">          

03<div class="form-wrap">

04<div class="form">

05  

06{% form_for blog_post_page %}

07<div class="form-errors">{% error_messages_for blog_post_page %} </div>

08<div id="blog-post-page-page-headline-input" class="blog-post-page-page-headline-input">

09

10{% text_field "page_headline", class:"text", placeholder: "{{ page.blog.public_posting_prompt }}" %}

11

12</div>

13

14<div id="blog-post-page-form-expanded" class="blog-post-page-form-expanded hide">

15

16<div class="padtopmore">

17{% text_area "content_editable", class:"textarea-tinymce" %}

18</div>

19

20<div class="padtop">

21{% submit_tag "Post", class:"submit-button" %}

22

23<div class="form-submit"></div>

24</div>

25</div>

26{% endform_for %}

27</div>

28{% unless request.logged_in? %}

29

30<div class="user-session-form-container hide">

31{% include "user_session_form" %}

32</div>

33{% endunless %}

34</div>

35</div>

36{% endif %}

Then replace that code with the following snippet:

1{% subpage "blog_unapproved" with "partial_blog_post_form" %}

Next, go to your theme files, which are located under Website > Theme and create a new file by clicking New File. You must have a custom theme to edit Theme files.

Call this new file "_partial_blog_post_form.html" and place the code you deleted from the blog page template in this file. You can also copy and past this code from the longer snippet above.

Once you've saved your "approved" blog template and the new file in your Theme files, and enabled user-submitted blog posts, you'll see the form for submission appear on your blog page. Because you altered the template, the blog posts submitted through this form will be housed under the "blog_unapproved" page.

Go to your "blog_unapproved" page > Blog settings and find the "Number of posts to show at a time." Enter "0."

If you wish, you can change the template of this blog to show a "Page could not be found" error if someone navigates to it unwittingly. To create a "Page not found error" remove all content from your "unapproved" blog's page template. Click Save. This will ensure that your "unapproved" blog is only accessible via the control panel.

To move a blog post from the unapproved blog to the approved blog, go the blog post you want to make public. Go to Settings > Page settings. Find the text box labelled "This page is a subpage of" and enter the approved blog slug. In our example, it is "blog." This will move the post to the approved blog.

Follow this same process for approving suggestion box submissions.

Hiding unapproved blog posts and suggestions from view

Following the instructions above will prevent anyone who visits your website from viewing an unapproved blog post or suggestion, but a person can still link to their own user-submitted blog post or suggestion. You can prevent unapproved blog posts or suggestions from being accessible by adding the following code to the theme templates for the pages in question (you'll need to have a custom theme or create a new one in order to make these changes).

1{% if page.parent.slug == "blog_unapproved" %}

2<p>The page you're looking for could not be found.</p>

3{% else %}

4...original page template...

5{% endif %}

You'll want to make that change in either pages_show_blog_post.html and pages_show_blog_post_wide.html for blog posts, or pages_show_suggestion.html and pages_show_suggestion_wide.html for suggestions.

Did this answer your question?