Create blocks to be displayed only to active Restrict Content Pro subscribers

Learn in this tutorial how to restrict the display of certain blocks only to active Restrict Content Pro subscribers in a block theme.

If you use Restrict Content Pro as a system for restricting content in WordPress, you will be used to adding the shortcodes [restrict]] and [[/restrict] before and after the material you want to hide from non-subscribers.

But wouldn’t it be much more practical and intuitive to be able to use a native WordPress block and tell it to be shown only to subscribers?

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 elements that we have used in previous tutorials:

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

Let’s get to it:

Instructions to hide the content of a block from users who do not have an active RCP subscription

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 you theme’s /assets/js/ folder (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 and core/code respectively.
• name: block variation internal name.
• title: block variation title.
• label: block variation label displayed in the editor.
• icon: block variation icon. 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, add the class restricted that will be used later to control the display of the block content.

2. Enqueue the new block variations

Once you have the file where you have registered the styles, you must enqueue 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 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_user_has_active_membership function to check if the user has an active subscription as well as making sure that the block has the CSS class restricted. All this inside the filter pre_render_block that allows you to display a message in case the conditions are met.

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

You can modify both the text displayed and the URL where to register (changing /register/ for the slug where your registration page is).

In the example, clicking on “login” shows a modal window to make it easier for the user to login using the Osom Modal Login plugin (it has to be active). But you can modify that part with a link to the login page or whatever you consider more appropriate.

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

Once you’ve hidden the blocks’ content from non-subscribers, you just need to give a bit of style to 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 content to active Restrict Content Pro subscribers while showing the rest of the users a personalized message inviting them to register or login.

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. 😉