Show Content Based On Role

Recommendation

Learn why I switched to WPCodeBox for managing code snippets for myself and for my clients.

Instructions

Snippet Type: PHP

  1. Copy the snippet.
  2. Add the snippet using WPCodeBox.
  3. Follow any customization notes provided.
  4. Save the snippet.
  5. Enable the snippet.
  6. Test.

Snippet

Customization Notes

There are actually two code snippets required here, so be sure to grab the CSS code snippet as well.

What the code snippet below is doing is adding body classes for user roles to WordPress by using the body_class filter.

You really don’t need to concern yourself with the geeky details, but I just wanted to put those details out there for documentation purposes.

				
					//ADD BODY CLASSES FOR USER ROLES TO WORDPRESS

add_filter( 'body_class', 'body_class_user_role' );

function body_class_user_role( $classes ) {

    if( is_user_logged_in() ) {

        $user_role = wp_get_current_user()->roles;
        $classes[] = 'user-role-' . $user_role[0];

    } 
    return $classes;
}
				
			

In the code snippet below, we are targeting the ‘Subscriber’ role and hiding any content that has the ‘hidefromsubscribers’ CSS class.

To target different roles, simply replace ‘subscriber’ with the role of your choice.

The CSS class, which in this case is ‘hidefromsubscribers’ can be written any way you want (ex. subscriberhide, hidefromxyz, etc.).

				
					.logged-in.user-role-subscriber .hidefromsubscribers { 
    display: none; 
}
				
			

Example Use Cases

  • Hide buttons by adding to the ‘hidefromsubscribers’ CSS class to the Elementor Button widget.
  • Hide MyListing Single Listing Blocks by adding the ‘hidefromsubscribers’ CSS class to the block within the Listing Type configuration.
  • Hide Menu items by exposing the CSS attribute setting in the WordPress menus and add the ‘hidefromsubscribers’ CSS class to the desired menu items.

Video Tutorial