thiscodeWorks - Organizing the best of code online

Disable Gutenberg & Return to the Classic WordPress Editor Without any Plugins

//How to Disable Gutenberg & Return to the Classic WordPress Editor Without any Plugins

add_filter( 'use_block_editor_for_post', '__return_false' );

#wordpress #php #gutenberg

Disable Block Templates

remove_theme_support(  'block-templates' );

#php #gutenberg #wordpress

WordPress Enable Block Templates

add_theme_support( 'block-templates' );

#wordpress #gutenberg #styles

Register Front-end and Editor styles on Gutenberg

<?php
/**
 * Gutenberg Examples Stylesheets
 */
 
function gutenberg_examples_02_register_block() {
    wp_register_script(
        'gutenberg-examples-02',
        plugins_url( 'block.js', __FILE__ ),
        array( 'wp-blocks', 'wp-element' ),
        filemtime( plugin_dir_path( __FILE__ ) . 'block.js' )
    );
 
    wp_register_style(
        'gutenberg-examples-02-editor',
        plugins_url( 'editor.css', __FILE__ ),
        array( 'wp-edit-blocks' ),
        filemtime( plugin_dir_path( __FILE__ ) . 'editor.css' )
    );
 
    wp_register_style(
        'gutenberg-examples-02',
        plugins_url( 'style.css', __FILE__ ),
        array( ),
        filemtime( plugin_dir_path( __FILE__ ) . 'style.css' )
    );
 
    // Allow inlining small stylesheets on the frontend if possible.
    wp_style_add_data( 'gutenberg-examples-02', 'path', dirname( __FILE__ ) . '/style.css' );
 
    register_block_type( 'gutenberg-examples/example-02-stylesheets', array(
        'api_version' => 2,
        'style' => 'gutenberg-examples-02',
        'editor_style' => 'gutenberg-examples-02-editor',
        'editor_script' => 'gutenberg-examples-02',
    ) );
}
add_action( 'init', 'gutenberg_examples_02_register_block' );

#wordpress #gutenberg #git #npm

NPM Create Block

$ npx @wordpress/create-block [options] [slug]

#wordpress #oxygen #css #gutenberg

Full-width Oxygen Gutenberg Block Style

.oxygen-body{
  /* Full width styling for Oxygen Gutenberg blocks and Gutenberg images*/
  width:100vw;
  overflow-x:hidden;
}

.alignfull {
    margin-left  : calc( -100vw / 2 + 100% / 2 );
    margin-right : calc( -100vw / 2 + 100% / 2 );
    max-width    : 100vw;
}

Disable Gutenberg & Return to the Classic WordPress Editor Without any Plugins

Disable Block Templates

WordPress Enable Block Templates

Register Front-end and Editor styles on Gutenberg

NPM Create Block

Full-width Oxygen Gutenberg Block Style

Save snippets that work with our extensions