Create blocks that are displayed only to a Restrict Content Pro subscriber type

Learn in this tutorial how to restrict the content viewing in a block to subscribers with a certain Restrict Content Pro membership level.

In a previous tutorial you saw how to get the content of a block displayed only to active Restrict Content Pro subscribers.

But what if you have multiple membership levels and you want the content of one of them to be shown only to those with a certain level?

That’s okay because you can use a similar strategy by applying some changes.

As I commented in the previous tutorial, some examples of blocks where it would be very practical to have this option are:

• Audio
• Image
• File
• Code

Let’s see how we can achieve this by combining several strategies from previous tutorials:

• Creating a block variation
• The filter pre_render_block
• The function rcp_get_customer_membership_level_ids

Let’s get to it:

Instructions to hide the content of a block from users of a particular RCP subscription level

1. Register a new block variation

The first thing you need to do is to register new variations.

To do this create a file called block-variations.js inside the /assets/js/ folder of your theme (if it doesn’t exist you can create it) with one of the following codes:

In the above 4 snippets the variation contains the following fields:

• Block name: core/audio, core/image, core/file y core/code respectively.
• name: internal name of the block variation.
• title: title of the block variation.
• label: label of the block variation displayed in the editor.
• icon: icon of the block variation. In this case a padlock (lock).

In the attributes you indicate, depending on the example:

• className: allows you to add a specific CSS class. In this case, it adds the class restricted-level-x which will be the one we will use later to control the display of the block content.

You can change the CSS class to the one you want, for example, restricted-level-gold. The only important thing is that you replace it in step 3.

2. Glue the new block variations

Once you have the file where you have registered the styles, you must glue them to the theme. To do this add the following snippet to the end of functions.php:

// Enqueue block variations
add_action( 'enqueue_block_editor_assets', 'cg_add_block_variations' );
function cg_add_block_variations() {
	wp_enqueue_script( 'cg-block-variations', get_stylesheet_directory_uri() . '/assets/js/block-variations.js', [ 'wp-blocks' ] );
}

3. Limits the display of block contents

Once you have already created the block variations that add a CSS class, you can limit the display of their content.

Add the following code snippet to your functionality plugin:

In this code you use the rcp_get_customer_membership_level_ids function to check if the user has an active membership subscription with the identifier 1. In addition you make sure that the block has the CSS class restricted-level-x. All this inside the filter pre_render_block that allows you to display a message in case the conditions are not met.

That is, users who do not have an active Restrict Content Pro subscription of the membership level you choose, instead of seeing the content of the block, they will see a message telling them that in order to see the content they have to login or subscribe.

You can modify the text displayed, of course.

4. Customize the CSS of the message displayed to the user

Once you’ve hidden the content of the blocks from non-subscribers, you just need to style the message that appears in place of the content.

To do this, add this block to the end of style.css:

This is just an example, but I invite you to customize it according to the design of the theme.

Conclusions

Now you know how to create blocks that only display their content to active subscribers of a certain Restrict Content Pro membership level and display a custom message to others inviting them to sign up or identify.

Any questions? Let me know in the comments.

And if you want to give me any suggestion for future tutorials, leave it in the contact form. Advantages of being a subscriber. 😉