Slide 1
Slide 1 text
WordCamp Calgary 2019
Reusable Blocks Everywhere
Slide 2
Slide 2 text
Shannon Smith
Platform Services Specialist
WordPress.com VIP
http://chroni.ca
Slide 3
Slide 3 text
New Block Editor
A new post and page
editing experience that
makes it easy to create rich
post layouts using “blocks”.
Slide 4
Slide 4 text
Discover the Possibilities
Let’s take a look at some feature highlights
- Use block templates to guide content creation.
- Eventually, you’ll use blocks instead of custom fields, shortcodes,
metaboxes and other ad-hoc elements, becoming far more intuitive
for editors.
Slide 5
Slide 5 text
New Block Editor
Slide 6
Slide 6 text
New Block Editor
Slide 7
Slide 7 text
New Block Editor
Slide 8
Slide 8 text
What is a Reusable
Block?
Blocks as content templates
Slide 9
Slide 9 text
You can turn any block
into a reusable block!
Slide 10
Slide 10 text
Getting Started
Creating reusable blocks
is easy
Slide 11
Slide 11 text
How Do I Create a Reusable Block?
Slide 12
Slide 12 text
How Do I Create a Reusable Block?
Slide 13
Slide 13 text
How Do I Create a Reusable Block?
Slide 14
Slide 14 text
How Do I Create a Reusable Block?
Slide 15
Slide 15 text
How Do I Create a Reusable Block?
Slide 16
Slide 16 text
How Do I Manage My Reusable Blocks?
Slide 17
Slide 17 text
How Do I Manage My Reusable Blocks?
https://example.com/wp-admin/edit.php?post_type=wp_block
Slide 18
Slide 18 text
Cool Ways to Use
Reusable Blocks
Slide 19
Slide 19 text
Call to Action (CTA)
Slide 20
Slide 20 text
Complex Content
Slide 21
Slide 21 text
Forms
Slide 22
Slide 22 text
Disclaimer
Slide 23
Slide 23 text
Reusable Blocks for Writing
Slide 24
Slide 24 text
Reusable Blocks for Editing
Slide 25
Slide 25 text
Tips & Tricks
Get the most out of your
reusable blocks
Slide 26
Slide 26 text
Edit All Reusable Blocks at Once
Slide 27
Slide 27 text
Reuse a Combination of Blocks
Slide 28
Slide 28 text
Reuse a Combination of Blocks
Slide 29
Slide 29 text
Reuse a Combination of Blocks
Slide 30
Slide 30 text
Themes
For Blocks?
“These components can
also take cues from themes
— like the color palette
component does—allowing
the theme to overwrite the
default colors.”
https://hmn.md/white-papers/gutenberg-
the-new-wordpress-editor/
https://matiasventura.com/post/
gutenberg-or-the-ship-of-theseus/
Slide 31
Slide 31 text
Add CSS Classes to Reusable Blocks
Slide 32
Slide 32 text
More Blocks Please!
Where to get more reusable
blocks
Slide 33
Slide 33 text
Exporting / Importing Reusable Blocks
Slide 34
Slide 34 text
Block Directory
https://
make.wordpress.org/
meta/2019/03/08/the-
block-directory-and-a-new-
type-of-plugin/
Slide 35
Slide 35 text
WordCamp Calgary 2019
Questions?
Slide 36
Slide 36 text
vip.wordpress.com/jobs