How to know whether you are editing a page or a post?

I have different styles applied to pages (I hide the title for them) and posts (I don’t want to hide the title here, but style the date of the post). I want to style them differently, which ist possible on the site itself. But in the editor I don’t seem to have the possibility to distinguish between pages and posts.

There is no css-class in an upper element which indicates whether I am editing a page or a post which I could use in my css.

How can i know what I am editing in the editor – a page or a post. It’s driving me crazy – there must be a way to know this.

Answers:

Thank you for visiting the Q&A section on Magenaut. Please note that all the answers may not help you solve the issue immediately. So please treat them as advisements. If you found the post helpful (or not), leave a comment & I’ll get back to you as soon as possible.

Method 1

You can use the admin_body_class hook to add your own CSS classes. For example (if you’re using Gutenberg):

function pb_admin_body_class($classes) {
    $screen = get_current_screen();

    if (!$screen->is_block_editor()) {
        return $classes;
    }

    $post_id = isset($_GET['post']) ? intval($_GET['post']) : false;
    $post_type = get_post_type($post_id);

    if ($post_type) {
        $classes .= $post_type;
    }

    return $classes;
}
add_filter('admin_body_class', 'pb_admin_body_class');

Method 2

The html code must be prepared for it.
For example different classes for the use of css.

example:

<div class="pages">
  <a href="#">title</a>
  <?php whatever the page title code ?>
</div>
<div class="posts">
  <a href="#">title</a>
  <?php whatever the posts title code ?>
</div>

then the css is easy:

 .pages{display:none;}

All methods was sourced from stackoverflow.com or stackexchange.com, is licensed under cc by-sa 2.5, cc by-sa 3.0 and cc by-sa 4.0