Skip to content

Instantly share code, notes, and snippets.

@awakekat
Created December 12, 2018 21:14
Show Gist options
  • Save awakekat/1da2ca8356d91a776d5b878e08d10dd8 to your computer and use it in GitHub Desktop.
Save awakekat/1da2ca8356d91a776d5b878e08d10dd8 to your computer and use it in GitHub Desktop.

Revisions

  1. awakekat created this gist Dec 12, 2018.
    46 changes: 46 additions & 0 deletions Gutenburp blahk
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,46 @@
    /**
    * vanilla-gutenberg-block.js
    *
    * Hello World: Step 1
    *
    * Simple block, renders and saves the same content without interactivity.
    *
    * Using inline styles - no external stylesheet needed. Not recommended
    * because all of these styles will appear in `post_content`.
    */
    ( function( blocks, i18n, element ) {
    var el = element.createElement;
    var __ = i18n.__;

    var blockStyle = {
    backgroundColor: '#900',
    color: '#fff',
    padding: '20px',
    };

    i18n.setLocaleData( window.gutenberg_examples_01.localeData, 'gutenberg-examples' );

    blocks.registerBlockType( 'gutenberg-examples/example-01-basic', {
    title: __( 'Example: Basic', 'gutenberg-examples' ),
    icon: 'universal-access-alt',
    category: 'layout',
    edit: function() {
    return el(
    'p',
    { style: blockStyle },
    'Hello World, step 1 (from the editor).'
    );
    },
    save: function() {
    return el(
    'p',
    { style: blockStyle },
    'Hello World, step 1 (from the frontend).'
    );
    },
    } );
    }(
    window.wp.blocks,
    window.wp.i18n,
    window.wp.element
    ) );