Transitioning to a block based editor in a pre-Gutenberg world

Slide 1

Slide 1 text

Transitioning to a block based editor in a pre- Gutenberg world Mark Wilkinson Co-founder & developer at Highrise Digital https://highrise.digital @wpmark

Slide 2

Slide 2 text

We are not anti-Gutenberg Neither is this talk

Slide 3

Slide 3 text

Designs have changed

Slide 4

Slide 4 text

(Maybe) A more traditional site design

Slide 5

Slide 5 text

Header Menus

Slide 6

Slide 6 text

Content The Editor

Slide 7

Slide 7 text

Sidebar Widgets

Slide 8

Slide 8 text

Footer Widgets?

Slide 9

Slide 9 text

A more modern design

Slide 10

Slide 10 text

A more modern design

Slide 11

Slide 11 text

Page built up of blocks of content

Slide 12

Slide 12 text

Page built up of blocks of content

Slide 13

Slide 13 text

The problem

Slide 14

Slide 14 text

wp_nav_menu() the_content() Sidebar widgets Footer widgets or wp_nav_menu()

Slide 15

Slide 15 text

No content

Slide 16

Slide 16 text

No content

Slide 17

Slide 17 text

Attempted solutions

Slide 18

Slide 18 text

[my_shortcode]

Slide 19

Slide 19 text

No content

Slide 20

Slide 20 text

No content

Slide 21

Slide 21 text

Page Builders

Slide 22

Slide 22 text

No content

Slide 23

Slide 23 text

Our solution

Slide 24

Slide 24 text

Advanced Custom Fields Flexible Content Field

Slide 25

Slide 25 text

Groups of fields - blocks Add multiple groups Drag and drop the order

Slide 26

Slide 26 text

HD ACF Blocks plugin

Slide 27

Slide 27 text

Content Hero Feature row Call to action Videos Quotes Image(s) Accordion Documents Locations Heading Separator Statistics Recent content Gravity form Pricing

Slide 28

Slide 28 text

No content

Slide 29

Slide 29 text

No content

Slide 30

Slide 30 text

Extensible development Template overrides Filterable fields Extensive actions and filters Lots of helper classes

Slide 31

Slide 31 text

Challenges

Slide 32

Slide 32 text

Interface/styling

Slide 33

Slide 33 text

No content

Slide 34

Slide 34 text

Interface/styling

Slide 35

Slide 35 text

Everything is post meta Not searchable - by default Reusable blocks

Slide 36

Slide 36 text

ACF Blocks for Gutenberg From Advanced Custom Fields https://www.advancedcustomfields.com/blog/acf-5-8- introducing-acf-blocks-for-gutenberg/

Slide 1

Slide 1 text

Slide 2

Slide 2 text

Slide 3

Slide 3 text

Slide 4

Slide 4 text

Slide 5

Slide 5 text

Slide 6

Slide 6 text

Slide 7

Slide 7 text

Slide 8

Slide 8 text

Slide 9

Slide 9 text

Slide 10

Slide 10 text

Slide 11

Slide 11 text

Slide 12

Slide 12 text

Slide 13

Slide 13 text

Slide 14

Slide 14 text

Slide 15

Slide 15 text

Slide 16

Slide 16 text

Slide 17

Slide 17 text

Slide 18

Slide 18 text

Slide 19

Slide 19 text

Slide 20

Slide 20 text

Slide 21

Slide 21 text

Slide 22

Slide 22 text

Slide 23

Slide 23 text

Slide 24

Slide 24 text

Slide 25

Slide 25 text

Slide 26

Slide 26 text

Slide 27

Slide 27 text

Slide 28

Slide 28 text

Slide 29

Slide 29 text

Slide 30

Slide 30 text

Slide 31

Slide 31 text

Slide 32

Slide 32 text

Slide 33

Slide 33 text

Slide 34

Slide 34 text

Slide 35

Slide 35 text

Slide 36

Slide 36 text

Slide 37

Slide 37 text

Slide 38

Slide 38 text