Skip to content

Instantly share code, notes, and snippets.

Avatar

Matias Ventura mtias

View GitHub Profile
@mtias
mtias / gutenberg-internal.js
Created Jul 29, 2021
How Gutenberg works witihin.
View gutenberg-internal.js
{
"name": "core/paragraph",
"attributes": {
"className": "my-text",
"content": {
"formats": (23) [empty × 6, Array(1), Array(1), Array(1), Array(1), Array(1), Array(1), empty, Array(1), Array(1), Array(1), Array(1), Array(1), Array(1), Array(1), Array(1), Array(1), empty]
"replacements": (23) [empty × 23]
"text": "Hello World! Read more."
},
"dropCap": false
View quijote.html
<!-- wp:separator -->
<hr class="wp-block-separator" />
<!-- /wp:separator -->
<!-- wp:paragraph {"align":"center","customFontSize":25} -->
<p style="font-size:25px;text-align:center"><em>Que trata de la condición y ejercicio del famoso hidalgo D. Quijote de la Mancha</em></p>
<!-- /wp:paragraph -->
<!-- wp:separator -->
<hr class="wp-block-separator" />
View markdown-copy.md

¡Hola! 🐻

If you like to write markdown, you should know that Gutenberg allows you to paste markdown text directly and it will be converted to native blocks instantly.

  • Including 🍎
  • Lists 🍇
  • Like this one 🍑

It is able to recognize quotes as well.

View template.php
<body>
<?php
do_blocks( array(
// Theme header
array( 'theme/header' ),
array( 'core/image' ),
array( 'core/heading', array(
'placeholder' => 'Add Author...',
'className' => 'my-custom-class',
View list-blocks.php
<?php
$parser = new Gutenberg_PEG_Parser;
$blocks = $parser->parse( get_post( $post_id )->post_content );
// ordered array of blocks in the post
// each block has the following keys
//
// 0 => string 'blockName'
// 1 => string 'attrs'
@mtias
mtias / block.js
Created Jun 23, 2017
Creating a Gutenberg block from the console.
View block.js
var el = wp.element.createElement;
wp.blocks.registerBlockType( 'mytheme/block', {
title: 'Red Block',
icon: 'universal-access-alt',
category: 'layout',
edit: function() {
return el( 'div', { style: { backgroundColor: '#900', color: '#fff', padding: '20px' } }, 'I am a red block.' );
},
save: function() {
@mtias
mtias / WP Post Doc
Created Dec 21, 2016
An example post
View WP Post Doc
## Grammar
<!-- wp:x y:z -->
Content
<!-- /wp -->
### Text
<!-- wp:text -->
The quick brown fox jumps over the lazy dog.
<!-- /wp -->
View calypso-redux.md

Directory

client
|— components
|— stores
   |— app.js
   |— {subject}
      |— index.js (reducers)
 |— actions.js
View gist:3efccda954ee2eee3a0b
/client
/auth
/boot
/layout
/manage
/posts
/sites
/pages
index.js
sidebar.js
View gist:3b14e1b431f706c02f6b
/*
* Authorization module.
*
* @Routes /authorize
* /login
* /logout
*/
var auth = require( 'auth' );