r3df.com
Rick Radko
Gutenberg: Revolutionizing
your WordPress site
Ottawa WordPress Meetup
November 7th, 2018
© 2018 Rick Radko, r3df.com
TL;DR
 Gutenberg is the code name for a new block based
content management interface in WordPress 5.0, due
out on Nov. 19th.
 In 5.0 Gutenberg will be the default content editing
interface, and replaces the current editing interface.
 Sites MAY break, especially if you have a page builder!
 Test your sites, BEFORE WordPress 5.0!
 Not ready? You can block Gutenberg with a plugin.
Slides: slideshare.net/r3df
1
© 2018 Rick Radko, r3df.com
What is Gutenberg?
Historical note:
 Johannes Gutenberg is the inventor
of the movable-type printing press.
As pertains to WordPress:
 “Gutenberg” is the codename for the 2017 WordPress
editor focus. - codex.wordpress.org/Gutenberg
2
© 2018 Rick Radko, r3df.com
Gutenberg Editor Focus
The editor will endeavour to create a new page
and post building experience that makes
writing rich posts effortless, and has “blocks”
to make it easy what today might take
shortcodes, custom HTML, or “mystery meat”
embed discovery. — Matt Mullenweg
3
“
wordpress.org/gutenberg/handbook
© 2018 Rick Radko, r3df.com
“GutenBlocks”
In Gutenberg - everything is a block!
 Blocks
 ALL content: headings, paragraphs, lists, images,
embeds, shortcodes, plugin content, widgets, pretty
much everything!
 Blocks have properties.
 Blocks even provide
structure/layout.
4
© 2018 Rick Radko, r3df.com
The sky is falling!
The release schedule:
 make.wordpress.org/core/5-0
 Targeting: Nov 19th, part of WordPress 5.0.
 Oh, by the way, there is a Twenty Nineteen theme -
make.wordpress.org/core/2018/10/16/introducing-twenty-nineteen
 Beta 3 – slid 3 days to Nov 5th.
 While the release date may still be sliding, it is coming
soon!
5
© 2018 Rick Radko, r3df.com
Demo Sites
3 places you can try it out without installing anything:
 testgutenberg.com
 frontenberg.tomjn.com
 wordpress.org/gutenberg
6
© 2018 Rick Radko, r3df.com
Gutenberg Plugin
Gutenberg is currently available for testing as a plugin:
 https://wordpress.org/plugins/gutenberg/
7
© 2018 Rick Radko, r3df.com
Test WordPress 5.0
Installing WordPress betas
 WordPress Beta Tester plugin
wordpress.org/plugins/wordpress-beta-tester
8
© 2018 Rick Radko, r3df.com
Time to see it in action!
9
© 2018 Rick Radko, r3df.com
Future of Gutenberg
Not just an editor replacement, it changes everything!
 Gutenberg operates like a simple block based page
builder.
Gutenberg has three planned stages:
1. The post editing experience and the
implementation of blocks. ( WP 5.0)
2. Beyond the post, into page templates.
3. Full site customization.
10
© 2018 Rick Radko, r3df.com
Future of themes?
 Themes become block templates?
 Lock down block layouts, but not content
11
© 2018 Rick Radko, r3df.com
Issues
 Maturity
 Accessability
12
© 2018 Rick Radko, r3df.com
Getting Ready
Try out Gutenberg now!
 Try one of the demos.
 Install the Gutenberg plugin on a private test site.
 Subdomain on your hosting
 Localhost
 Have everyone who manages content on your site(s) try
it out
 Even better, create a copy of your site(s) and install
Gutenberg and try it there!
13
© 2018 Rick Radko, r3df.com
Getting Ready Continued…
Testing:
 Check with your website developer (if you have one) on
their plans for updates/testing.
 Google your theme and plugins to see if there are
Gutenberg updates, or any planned.
 Many of the major vendors have at least posted blog
posts about Gutenberg. – Some of them are very
interesting reading!
 Create a copy of your site(s) and install Gutenberg and
test it! 14
© 2018 Rick Radko, r3df.com
Getting Ready Continued…
Where are the problems likely to be:
 Themes:
 Highly custom themes.
 Custom page layouts/templates.
 Plugins:
 Custom content on pages.
 Meta boxes for metadata.
 Shortcodes
 Custom work that pushes WordPresses boundaries.
15
© 2018 Rick Radko, r3df.com
Getting Ready Continued….
Updating to Gutenberg:
 Create backups of your site before updating!
 Test Gutenberg on a development copy of your site,
before updating.
 Update to Gutenberg.
16
© 2018 Rick Radko, r3df.com
Blocking Gutenberg
 You can block Gutenberg with the Classic Editor Plugin.
 Classic Editor - wordpress.org/plugins/classic-editor
17
© 2018 Rick Radko, r3df.com
Blocking Gutenberg
 You can block Gutenberg with one of 2 other plugins.
 Gutenberg Ramp
wordpress.org/plugins/gutenberg-ramp
 Disable Gutenberg
wordpress.org/plugins/disable-gutenberg
18
© 2018 Rick Radko, r3df.com
Links
More information:
 https://wordpress.org/gutenberg/
 https://wordpress.org/gutenberg/handbook/
 + Tons of reviews blog posts and rants if you search
Google.
19
© 2018 Rick Radko, r3df.com
Contact
Rick Radko
 email: wpinfo@r3df.com
 twitter: @r3designforge
Website:
 r3df.com
Slides at:
 www.slideshare.net/r3df
20

Gutenberg: Revolutionizing your WordPress site

  • 1.
    r3df.com Rick Radko Gutenberg: Revolutionizing yourWordPress site Ottawa WordPress Meetup November 7th, 2018
  • 2.
    © 2018 RickRadko, r3df.com TL;DR  Gutenberg is the code name for a new block based content management interface in WordPress 5.0, due out on Nov. 19th.  In 5.0 Gutenberg will be the default content editing interface, and replaces the current editing interface.  Sites MAY break, especially if you have a page builder!  Test your sites, BEFORE WordPress 5.0!  Not ready? You can block Gutenberg with a plugin. Slides: slideshare.net/r3df 1
  • 3.
    © 2018 RickRadko, r3df.com What is Gutenberg? Historical note:  Johannes Gutenberg is the inventor of the movable-type printing press. As pertains to WordPress:  “Gutenberg” is the codename for the 2017 WordPress editor focus. - codex.wordpress.org/Gutenberg 2
  • 4.
    © 2018 RickRadko, r3df.com Gutenberg Editor Focus The editor will endeavour to create a new page and post building experience that makes writing rich posts effortless, and has “blocks” to make it easy what today might take shortcodes, custom HTML, or “mystery meat” embed discovery. — Matt Mullenweg 3 “ wordpress.org/gutenberg/handbook
  • 5.
    © 2018 RickRadko, r3df.com “GutenBlocks” In Gutenberg - everything is a block!  Blocks  ALL content: headings, paragraphs, lists, images, embeds, shortcodes, plugin content, widgets, pretty much everything!  Blocks have properties.  Blocks even provide structure/layout. 4
  • 6.
    © 2018 RickRadko, r3df.com The sky is falling! The release schedule:  make.wordpress.org/core/5-0  Targeting: Nov 19th, part of WordPress 5.0.  Oh, by the way, there is a Twenty Nineteen theme - make.wordpress.org/core/2018/10/16/introducing-twenty-nineteen  Beta 3 – slid 3 days to Nov 5th.  While the release date may still be sliding, it is coming soon! 5
  • 7.
    © 2018 RickRadko, r3df.com Demo Sites 3 places you can try it out without installing anything:  testgutenberg.com  frontenberg.tomjn.com  wordpress.org/gutenberg 6
  • 8.
    © 2018 RickRadko, r3df.com Gutenberg Plugin Gutenberg is currently available for testing as a plugin:  https://wordpress.org/plugins/gutenberg/ 7
  • 9.
    © 2018 RickRadko, r3df.com Test WordPress 5.0 Installing WordPress betas  WordPress Beta Tester plugin wordpress.org/plugins/wordpress-beta-tester 8
  • 10.
    © 2018 RickRadko, r3df.com Time to see it in action! 9
  • 11.
    © 2018 RickRadko, r3df.com Future of Gutenberg Not just an editor replacement, it changes everything!  Gutenberg operates like a simple block based page builder. Gutenberg has three planned stages: 1. The post editing experience and the implementation of blocks. ( WP 5.0) 2. Beyond the post, into page templates. 3. Full site customization. 10
  • 12.
    © 2018 RickRadko, r3df.com Future of themes?  Themes become block templates?  Lock down block layouts, but not content 11
  • 13.
    © 2018 RickRadko, r3df.com Issues  Maturity  Accessability 12
  • 14.
    © 2018 RickRadko, r3df.com Getting Ready Try out Gutenberg now!  Try one of the demos.  Install the Gutenberg plugin on a private test site.  Subdomain on your hosting  Localhost  Have everyone who manages content on your site(s) try it out  Even better, create a copy of your site(s) and install Gutenberg and try it there! 13
  • 15.
    © 2018 RickRadko, r3df.com Getting Ready Continued… Testing:  Check with your website developer (if you have one) on their plans for updates/testing.  Google your theme and plugins to see if there are Gutenberg updates, or any planned.  Many of the major vendors have at least posted blog posts about Gutenberg. – Some of them are very interesting reading!  Create a copy of your site(s) and install Gutenberg and test it! 14
  • 16.
    © 2018 RickRadko, r3df.com Getting Ready Continued… Where are the problems likely to be:  Themes:  Highly custom themes.  Custom page layouts/templates.  Plugins:  Custom content on pages.  Meta boxes for metadata.  Shortcodes  Custom work that pushes WordPresses boundaries. 15
  • 17.
    © 2018 RickRadko, r3df.com Getting Ready Continued…. Updating to Gutenberg:  Create backups of your site before updating!  Test Gutenberg on a development copy of your site, before updating.  Update to Gutenberg. 16
  • 18.
    © 2018 RickRadko, r3df.com Blocking Gutenberg  You can block Gutenberg with the Classic Editor Plugin.  Classic Editor - wordpress.org/plugins/classic-editor 17
  • 19.
    © 2018 RickRadko, r3df.com Blocking Gutenberg  You can block Gutenberg with one of 2 other plugins.  Gutenberg Ramp wordpress.org/plugins/gutenberg-ramp  Disable Gutenberg wordpress.org/plugins/disable-gutenberg 18
  • 20.
    © 2018 RickRadko, r3df.com Links More information:  https://wordpress.org/gutenberg/  https://wordpress.org/gutenberg/handbook/  + Tons of reviews blog posts and rants if you search Google. 19
  • 21.
    © 2018 RickRadko, r3df.com Contact Rick Radko  email: wpinfo@r3df.com  twitter: @r3designforge Website:  r3df.com Slides at:  www.slideshare.net/r3df 20