WordPress Reusable Blocks Everywhere

A tour of the new reusable blocks that are built into the new WordPress editing experience (formerly known as Gutenberg). This new feature lets you reuse content on the fly, quickly and easily without any special skills and without copying and pasting. Find out how to make the most of it!

This talk will feature how-tos and tips for users, but also include suggestions for designers and developers who want to make reusable blocks work with their themes.

Shannon Smith is a platform services specialist with WordPress.com VIP. She delivers content solutions to some of the biggest names in media, marketing, and enterprise. Shannon has over 15 years experience in open source web development. She is a long-time supporter of diversity, accessibility and internationalization, and was a WordPress Montreal community organizer for seven years. Shannon is also a hiker, poet, and mum of four.

Transcript

1. WordCamp Calgary 2019
   Reusable Blocks Everywhere
   

   View Slide

2. Shannon Smith
   Platform Services Specialist
   WordPress.com VIP
   http://chroni.ca
   

   View Slide

3. New Block Editor
   A new post and page
   editing experience that
   makes it easy to create rich
   post layouts using “blocks”.
   

   View Slide

4. 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.
   

   View Slide

5. New Block Editor
   

   View Slide

6. New Block Editor
   

   View Slide

7. New Block Editor
   

   View Slide

8. What is a Reusable
   Block?
   Blocks as content templates
   

   View Slide

9. You can turn any block
   into a reusable block!
   

   View Slide

10. Getting Started
    Creating reusable blocks
    is easy
    

    View Slide

11. How Do I Create a Reusable Block?
    

    View Slide

12. How Do I Create a Reusable Block?
    

    View Slide

13. How Do I Create a Reusable Block?
    

    View Slide

14. How Do I Create a Reusable Block?
    

    View Slide

15. How Do I Create a Reusable Block?
    

    View Slide

16. How Do I Manage My Reusable Blocks?
    

    View Slide

17. How Do I Manage My Reusable Blocks?
    https://example.com/wp-admin/edit.php?post_type=wp_block
    

    View Slide

18. Cool Ways to Use
    Reusable Blocks
    

    View Slide

19. Call to Action (CTA)
    

    View Slide

20. Complex Content
    

    View Slide

21. Forms
    

    View Slide

22. Disclaimer
    

    View Slide

23. Reusable Blocks for Writing
    

    View Slide

24. Reusable Blocks for Editing
    

    View Slide

25. Tips & Tricks
    Get the most out of your
    reusable blocks
    

    View Slide

26. Edit All Reusable Blocks at Once
    

    View Slide

27. Reuse a Combination of Blocks
    

    View Slide

28. Reuse a Combination of Blocks
    

    View Slide

29. Reuse a Combination of Blocks
    

    View Slide

30. 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/
    

    View Slide

31. Add CSS Classes to Reusable Blocks
    

    View Slide

32. More Blocks Please!
    Where to get more reusable
    blocks
    

    View Slide

33. Exporting / Importing Reusable Blocks
    

    View Slide

34. Block Directory
    https://
    make.wordpress.org/
    meta/2019/03/08/the-
    block-directory-and-a-new-
    type-of-plugin/
    

    View Slide

35. WordCamp Calgary 2019
    Questions?
    

    View Slide

36. vip.wordpress.com/jobs
    

    View Slide