Hide MemberMouse dripped content in post grid

Overview

Many of our customers use the MemberMouse membership plugin on their WordPress membership sites.

Related: Our full MemberMouse Review

MemberMouse allows you to easily protect member content.

You can do this in a number of ways:

• Shortcodes – MemberMouse calls these SmartTags. You just wrap your content in the shortcode, specify the conditions, and MemberMouse will show / hide content based on the member's product access.
• Content protection widget – This is an easy to use widget in the post edit screen that allows you to protect entire posts and pages based on membership level and bundle status.
• PHP code – a more advanced way of protecting content programmatically.

In this way, you can make sure members can only access the content they have permission to view.

For this tutorial you'll need to make sure you have the following:

• MemberMouse – Membership plugin for WordPress
• WPBakery Visual Builder – page builder for WordPress

What does “content dripping” mean?

One of MemberMouse's features is called “Content dripping”.

This feature allows you to release content over time.

For example, maybe you don't want a new member to access a post that contains advanced content right after they register.

Instead, you want them to concentrate on the basics first.

By using the drip schedule in MemberMouse, you can set the content to become available only after, let's say, 60 days after the member joined.

The problem with the MemberMouse protected content widget

At the moment MemberMouse only has a very rudimentary widget you can use to display dripped content.

Let's say you're displaying a list of links that contains some links to dripped content.

And you don't want the member to see these links until that content “drips” to them.

Currently, if you click on a link to a piece of content that hasn't yet dripped, it will just show an error message to the member.

That makes for a bad user experience.

Ideally, you'll want the link to the dripped content to be visible only when the content itself becomes available to the member.

The Protect Content Widget can help you with that but it isn't flexible enough for every situation.

At MemberFix we encountered this issue while working on a customer's site.

We were trying to hide links and thumbnails to not-yet-dripped content.

This particular customer uses the Visual Composer page builder and the Post Grid element.

We had a very nice carousel slider that was displaying links to various content.

BUT, the slider element just shows all of the content in a given category.

It doesn't check to see whether or not that content is available to the member.

And therefore, it shows links to content that hasn't dripped.

If a member clicks on this, they will get an error message.

So our task here is to hide the thumbnails and links to any content that hasn't yet dripped for the member.

We came up with a solution to this issue, and now we're sharing it with you!

Hiding protected content in a Post Grid element

Video Tutorial

The Visual Composer Post Grid element setup

This screenshot shows an example of a Post Grid element we use, the data source is Posts and we display all the posts from the DrippedContent category

The member will see the element like this:

But one of the posts is set up to drip.

The member should only be able to access it after he's been registered on the site for 99 days.

Normally, if the member clicks on the Third Post link they would get an access denied notice.

We don't want that and we want the link to that post to be hidden until the content is available (on day 99).

Customizing the Post Grid element

The Post Grid element is very flexible and allows you to pull data from various sources.

What we're looking for in that list is a way to retrieve custom posts.

In our case, we want to check if the post is available (dripped). For that we'll use the Custom Query option.

Let's change the current Post Grid element to use Custom Query as data source.

The custom query data source is using the query_posts() WordPress function and the Custom Query Post Grid options are the parameters for that function.

What you see in the screenshot is basically calling this function query_posts(‘cat=25') which “translates” to “get me all the posts from the category with id 25”, which is the DrippedContent category.

What we want to do now is create a function that replicates this behavior but also checks if the posts can be viewed.

We will be using a custom parameter check_schedule for the query_posts() function

This is how we want the Post Grid options to look like:

Implementing the custom check

To implement the custom content check we'll need to edit the functions.php file of the active theme and add this code to it.

Always make sure you're using a child theme for your custom edits, this way when the main theme gets updated you won't lose them.

add_action( 'pre_get_posts', 'check_schedule_pre_get_posts' );

function check_schedule_pre_get_posts($query) {

  if(isset($query->query_vars['check_schedule'])) {

    global $wpdb;

    $days_as_member = mm_member_data(array("name"=>"daysAsMember"));

    $results = $wpdb->get_results("select post_id from mm_posts_access where days >=".$days_as_member." ", ARRAY_A);

    $posts_array= array_column($results, 'post_id');

    $query->set('posts_per_page', -1);

    $query->set('post__not_in', $posts_array);

    }

}

Result

The post grid is now performing the correct behavior. It only shows the posts that the member can access (which have already dripped according to your MemberMouse schedule).

Note that while this tutorial focuses on the WPBakery Visual Builder, you could achieve this same functionality with Divi, Elementor, Beaver Builder, etc.

If you run into any issues, leave you comments below.

We're happy to help!