Depending on your needs, there are several ways to hide content in WordPress. For example, you can make a post private, remove an element from a WordPress theme, hide content with a “Read More” button, hide content based on specific user properties, and more.
In this tutorial, I cover some common methods using programmatic solutions and free plugins.
Hide Content by Making Specific Pages Private
If you have to hide a limited number of posts from public view, edit the individual post that you want to make private, open the Summary post sidebar section, and set the visibility value to “Private.”

The same change can be applied in bulk from the menu with the list of posts. (E.g. All Posts, All Pages, etc.) Here first select the posts using the checkbox, then select “Edit” with the select box at the top of the page and click Apply.
To conclude, under the Status value, select “Private” and click the Update button.

Password Protecting Posts Using the WordPress Built-In Feature
WordPress has a built-in feature to password-protect individual posts and pages.
To use this feature, first edit the post that you want to password-protect. After that, open the Summary post sidebar section of the post editor. To conclude, click the link beside “Visibility” and select “Password protected”, then enter the password in the provided input field.

Hide Content in a Specific Time Range
The Restricted Blocks plugin allows you to hide editor blocks based on custom criteria.
Using the Time Interval restriction you can set a time interval in which you want to remove the block from the front-end layout.
To start, install the plugin from the WordPress.org plugin repository,
When the plugin is activated, proceed to the Restrictions menu. Here, you can configure particular restrictions that will later apply to blocks.
Create a new restriction with a custom name and select Time Range as the name of the restriction. Then, open the Time Range section and enter the time interval in which the block should remain hidden. To conclude, under the Advanced tab, select the “Exclude” mode.

To apply the restriction to a block, edit the post and click on the block on which you want to apply the restriction. Then, under the Restriction block sidebar section, select the restriction you just created.

Hide Content Based on the User Device
To achieve this, we are going to use Content Control, a popular content restriction plugin for WordPress.
With the plugin installed, open the Device Rules section and select which device should see the selected block. The options are Mobile, Tablet, and Desktop.

Hide Content Based on the User Role
Using another feature of the Content Control plugin, we can make content visible only to the specified user role. To achieve this, click on the block where you want to apply this behavior. Then, in the User Rules section, select “Logged in Users”.” With the User Role selector, set “Matching”. Finally, using the Chosen Roles field, add the WordPress roles that should be able to see this content.

It’s worth noting that you can use this type of restriction, for example, to create private sections of the site accessible only to paying subscribers. You first create a role for the paying subscriber; then you manually enable content using the Content Control plugin.
Using Conditional Tags in Themes
If you are comfortable editing theme files, use WordPress conditional tags to hide content based on certain conditions.
Example of hiding content for non-logged-in users:
<?php if ( is_user_logged_in() ) : ?>
<p>This content is only visible to logged-in users.</p>
<?php else : ?>
<p>You must be logged in to see this content.</p>
<?php endif; ?>
Add this code to your theme’s template files where you want the content to be conditionally displayed.
Using the Reusable Blocks
Using the Gutenberg block editor, you can use the Reusable Blocks feature to create content blocks that you can easily show or hide.
- Create a reusable block for the content you want to hide.
- You can add or remove this block when editing a page or post as needed.
Hiding Widgets
You can conditionally hide widgets using widget area plugins like Content Aware Sidebars. These plugins allow you to control where and when widgets appear based on various conditions.
Hide Content Using an Accordion
The accordion is a UI element that displays and collapses specific elements on the page.
With the Ultimate Blocks plugin, you can create a Content Toggle block that acts as an accordion element. To start, with the plugin active on your WordPress site, proceed to the Toggle State block sidebar section and enable the Collapsed property.

Hide Content With Elementor
The Display Conditions feature of Elementor gives you several possibilities to achieve this, including post conditions (category, tags, author, etc.), user status related conditions (login status, role, etc.), date-related conditions, and more.
Here is the Elementor tutorial on how to show and hide elements using the display conditions. Details on all the conditions are available here.
Note that Display Conditions is a premium feature of Elementor. Consequently, these functionalities are locked in the free edition available on WordPress.org.
Create a Read More Link/Button to Show Hidden Content
This feature is used when you want to add textual content to the page without taking up too much space in the layout.
Programmatic Solution
Since adding this functionality requires a simple implementation, we will first see a programmatic solution.
First, add the link or button to display the hidden content. The default block named “Buttons” is ideal for this job. Then, assign a class to the button. This can easily be done directly in the WordPress post editor using the Additional CSS Class(es) field. This class will be used in the JavaScript part to create an event listener associated with this element.

You also have to assign an identifier or a class to the hidden content. This other selector will be used to display the hidden content by modifying the element style with JavaScript.
Now add in your theme CSS files a rule to make by default the content with that class hidden:
.hidden-content{
display: none;
}
To conclude, add a JavaScript script to your site:
/**
* Enqueue a script with jQuery as a dependency.
*/
function enqueue_read_more_scripts() {
wp_enqueue_script( 'read-more', get_stylesheet_directory_uri() . '/js/read-more.js', array( 'jquery' ) );
}
add_action( 'wp_enqueue_scripts', 'enqueue_read_more_scripts' );
In the script, add the following content:
(function($) {
$(document).ready(function($) {
$('.read-more-button').click(function() {
// Display the hidden content.
$('.hidden-content').show();
});
});
}(jQuery));
Using a Plugin
If you prefer using a plugin, there are a few options for this. In this tutorial, I’ll be using the most popular and best-rated “Read More” plugin, which is the Read More & Accordion plugin.
Begin by visiting the plugin’s Read More menu. In this menu, you can create multiple types of read-more variations, specifically a button, an inline button, an accordion, a link button, a button & popup, and more. For this tutorial, I used the “Button” type.

Assign a name to your “Read More” button. Then, configure the dimensions of the element, style options, animation options, and more.
After saving, you will be provided with a shortcode. Copy it and include it in your post. That’s all. The “Read More” element is now available in your post.
Hide Content With CSS
You can hide specific elements on your site using custom CSS. This method hides content visually but does not restrict access to it in the source code.
The first step involves first identifying the selectors of the element that you want to hide. You can achieve this by opening the site with Chrome and then clicking F12 to open the Chrome DevTools (a tool for web developers that allows you to inspect and modify the page). Click on the arrow at the top left of the DevTools window, and then click again on the element that you want to remove. This operation will display the HTML of the element that you want to remove, including its selectors. Write down the selector of the element that you want to remove.
Then add to your theme custom CSS this rule:
#elements-to-remove{
display: none;
}
Note that if the element that you want to remove doesn’t have a selector you can achieve the same by applying a more complex CSS rule or by adding the id or class by modifying the theme.
Completely Remove an Element From the WordPress Theme
This process is more complex and requires the following procedure:
- Create a child theme. This step is necessary to prevent overwriting the theme at each theme update.
- Identify the element that you want to hide from the theme
- Remove it from the theme