Skip to content

Instantly share code, notes, and snippets.

@5ally 5ally/my-block.css Secret
Last active May 16, 2019

Embed
What would you like to do?
/* See wp-includes/css/dist/block-library/editor.css */
.editor-block-list__layout .editor-block-list__block[data-type="my-gutenberg/my-block"] .mce-btn.mce-active button,
.editor-block-list__layout .editor-block-list__block[data-type="my-gutenberg/my-block"] .mce-btn.mce-active:hover button,
.editor-block-list__layout .editor-block-list__block[data-type="my-gutenberg/my-block"] .mce-btn.mce-active i,
.editor-block-list__layout .editor-block-list__block[data-type="my-gutenberg/my-block"] .mce-btn.mce-active:hover i {
color: #23282d; }
.editor-block-list__layout .editor-block-list__block[data-type="my-gutenberg/my-block"] .mce-btn i {
font-style: normal; }
.editor-block-list__layout .editor-block-list__block[data-type="my-gutenberg/my-block"] .mce-toolbar-grp > div {
padding: 1px 3px; }
.editor-block-list__layout .editor-block-list__block[data-type="my-gutenberg/my-block"] .editor-block-list__block-edit::before {
outline: 1px solid #e2e4e7; }
.editor-block-list__layout .editor-block-list__block[data-type="my-gutenberg/my-block"].is-hovered .editor-block-list__breadcrumb {
display: none; }
div[data-type="my-gutenberg/my-block"] .editor-block-contextual-toolbar + div {
margin-top: 0;
padding-top: 0; }
@media (min-width: 600px) {
.editor-block-list__block[data-type="my-gutenberg/my-block"] .editor-block-switcher__no-switcher-icon {
display: none; }
.editor-block-list__block[data-type="my-gutenberg/my-block"] .editor-block-contextual-toolbar {
float: right;
margin-right: 23px;
transform: translateY(-13px);
top: 14px; }
.editor-block-list__block[data-type="my-gutenberg/my-block"] .editor-block-contextual-toolbar .editor-block-toolbar {
border: none;
margin-top: 3px; } }
@media (min-width: 600px) and (min-width: 782px) {
.editor-block-list__block[data-type="my-gutenberg/my-block"] .editor-block-contextual-toolbar .editor-block-toolbar {
margin-top: 0; } }
@media (min-width: 600px) {
.editor-block-list__block[data-type="my-gutenberg/my-block"] .editor-block-contextual-toolbar .editor-block-toolbar::before {
content: "";
display: block;
border-left: 1px solid #e2e4e7;
margin-top: 4px;
margin-bottom: 4px; }
.editor-block-list__block[data-type="my-gutenberg/my-block"] .editor-block-contextual-toolbar .components-toolbar {
background: transparent;
border: none; }
.editor-block-list__block[data-type="my-gutenberg/my-block"] .mce-container.mce-toolbar.mce-stack-layout-item {
padding-right: 36px; } }
( function() {
var el = wp.element.createElement;
var ClassicEdit; // An instance of the private ClassicEdit class.
wp.blocks.registerBlockType( 'my-gutenberg/my-block', {
title: 'My Title',
description: 'My cool block.',
category: 'common',
icon: 'email-alt',
keywords: [ 'email' ],
attributes: {
content: {
type: 'string',
source: 'meta',
meta: 'the_meta'
}
},
supports: {
customClassName: false,
},
edit: function( props ) {
if ( ! ClassicEdit ) {
var block = wp.blocks.getBlockType( 'core/freeform' );
ClassicEdit = ( class extends block.edit {
componentDidMount() {
// Call the parent method to setup TinyMCE, etc.
block.edit.prototype.componentDidMount.call( this );
// Change the toolbar's title - to your block's.
jQuery( '#toolbar-' + this.props.clientId )
.attr( 'data-placeholder', 'My Title' );
}
} );
}
return el( ClassicEdit, props );
},
save: function( props ) {
}
} );
} )();
<?php
/**
* Plugin Name: WPSE 337978
*/
if ( ! defined( 'ABSPATH' ) ) {
exit; // Exit if accessed directly.
}
// Load our block's assets.
add_action( 'enqueue_block_assets', function() {
$plugin_url = plugin_dir_url( __FILE__ );
wp_enqueue_style( 'my-block', $plugin_url . 'my-block.css', [ 'wp-edit-blocks' ], '' );
wp_enqueue_script( 'my-block', $plugin_url . 'my-block.js', [ 'wp-editor' ], '', true );
} );
// Register the metadata for the REST API.
function gutenberg_my_block_init() {
register_meta( 'post', 'the_meta', [
'show_in_rest' => true,
'single' => true,
'type' => 'string',
] );
}
add_action( 'init', 'gutenberg_my_block_init' );
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
You can’t perform that action at this time.