But it’s just not working even after I’ve added a class of .logged-in
I’m not sure what you mean by this.
This class is automatically added to the body tag by WordPress when users are logged in to the site. So the HTML side is covered already, and as the forum topic you linked to says, you’re to add the class to your CSS selector.
So if the element you want to hide has the class hide-me in the HTML, but you only want to hide it for logged-in users, your CSS selector becomes:
.logged-in .hide-me {
display: none;
}
@gappiah Thanks for the clarification, it’s my misunderstanding in the past.
-
This reply was modified 5 years, 1 month ago by
karchung0930.
Just a quick caveat to note: using CSS is not a secure way to control visibility.
If the element in questions is of a sensitive nature, you should be handling the protection at the application level.
If you’re using the native (aka Gutenberg) editor, you can use a plugin like “Blocks Visibility” to control who sees individual blocks using criteria such as logged-in only, logged-out only, user role, date, device/screen size, etc.
https://ww.wp.xz.cn/plugins/block-visibility/
@gappiah What about in a JAVASCRIPT way? Is that possible to remove the element by class if user didn’t login and restore it when they login?
