Block disappears when adding class ‘hidden’

  • kristinamalm

    (@kristinamalm)


    5 years, 8 months ago

    When adding a custom css class called ‘hidden’ to a block in the gutenberg editor, the block immediately disappears and can’t be reached. What could be the reason for this?

Viewing 3 replies - 1 through 3 (of 3 total)
  • Niall Madhoo

    (@nm1com)

    5 years, 8 months ago

    Hello @kristinamalm,

    The hidden class is part of the WordPress Admin styles (https://github.com/WordPress/WordPress/blob/master/wp-admin/css/common.css line 166. It sets the block you edited to display: none;, which is why it disappears.


    I recommend labeling the class differently, such as “hide” instead of “hidden” to avoid a conflict with the WordPress Admin styles.

    Thread Starter kristinamalm

    (@kristinamalm)

    5 years, 8 months ago

    Hi Niall, thank you for a fast reply!

    I see, then I will name it in a different way. Now I only wonder how I can get a hold of the hidden block and change the class (since it’s not showing in the GUI). Any idea? I tried to override the .hidden default styling by setting display:block !important but that way it only appeared on the site and not in the GUI editor. This feels like a bug, even if I add the .hidden class it should still be showing in the editor right?

    Niall Madhoo

    (@nm1com)

    5 years, 8 months ago

    You’re welcome!

    It seems like a bug to me too, or at least a design flaw. The admin styles shouldn’t affect the editor in this way.

    I recommend the following to remove the class:

    • Click on the three dots at the top right of the editor
    • Click on “Code editor,” which will allow you to edit the source code for the page/post you’re editing
    • Look for class="hidden" under “Editing code” (the code editor) and delete the class

      • You could also use the Revisions system to restore the content before the .hidden class was added: https://ww.wp.xz.cn/support/article/revisions/. If you made changes after adding the class, you can copy/paste the new content after restoring the content.

Viewing 3 replies - 1 through 3 (of 3 total)

The topic ‘Block disappears when adding class ‘hidden’’ is closed to new replies.

Tags