Outline Blocks While Editing
Draws a faint dashed outline around blocks as you hover over them in the editor, making nested groups, columns and empty blocks easy to see.
Opens WPIDE on
Code
add_action( 'enqueue_block_assets', function () {
if ( ! is_admin() ) {
return;
}
wp_register_style( 'wpide-block-outlines', false, array(), '1.0' );
wp_enqueue_style( 'wpide-block-outlines' );
wp_add_inline_style( 'wpide-block-outlines', '.editor-styles-wrapper .wp-block:hover{outline:1px dashed rgba(120,120,120,.45);outline-offset:2px;}.editor-styles-wrapper .wp-block.is-selected:hover{outline:none;}' );
} );How to add this snippet
- Install WPIDE on your WordPress site (it is free) and open Code Snippets.
- Use snippet above adds it from the library in one click. Or copy the code into a new snippet with the same code type.
- It is added inactive: review the code and settings, then switch it on.