‘Let’s Code series’ Videos

  • Let’s code: developing blocks without React! – Controls

    Speakers: Jonathan Bossenger, Leo Gopal

    December 2, 2022 — This series of workshops looks at building a WordPress block, without using React JSX.

    So far, we’ve built a WordPress block using plain JavaScript which supports custom styles via a stylesheet, and which uses block attributes and the RichText component to allow the user to edit the block content. Next, we will add a block control and an additional attribute to allow the user to edit the block alignment.

    Presentation Slides »

  • Let’s code: developing blocks without React! – Attributes and RichText

    Speaker: Jonathan Bossenger

    November 25, 2022 — In the previous session, we built a simple WordPress block using plain JavaScript. However, the block was static. A user couldn’t edit the content in any way.

    In this session, we add support for attributes, as well as implement the pre-existing RichText component. These changes enable a user to edit the content of the block.

    Presentation Slides »

  • Let’s code: developing blocks without React! – All about Attributes

    Speakers: Jonathan Bossenger, Álvaro Gómez

    November 18, 2022 — In the previous session, we built a simple WordPress block using plain JavaScript. However, the block was static, in that a user couldn’t edit the content in any way.

    This week we will add support for attributes, as well as implement the pre-existing RichText component. These will enable a user to edit the content of the block.

    Presentation Slides »

  • Let’s code: developing blocks without React! – Block Basics

    Speaker: Jonathan Bossenger

    November 11, 2022 — This series of workshops will cover what developing blocks without React might look like.

    In part 1 we cover the initial files needed to register a block, go over some of the JavaScript syntax and WordPress dependencies, and then add some styling to our block via a useBlockProps and custom stylesheets.

    Presentation Slides »

  • Lets code: internationalization in block themes

    Speaker: Jonathan Bossenger

    November 7, 2022 — In this session, we will take a brief look at what Internationalisation (or i18n) in themes means, as well as cover the common Internationalisation functions available in WordPress, and how to use them. We’ll then create a blank block theme, and then take a look at the strings that we might need to make translation ready, as well as how to achieve this.

    Presentation Slides »

  • Let’s code: using block patterns in your block theme

    Speaker: Jonathan Bossenger

    October 21, 2022 — Block patterns are predefined block layouts. They provide a means to refine the editorial experience by offering users a preset arrangement of blocks to start building right away.

    One of the great advantages of block patterns is that they can include either block markup or PHP code. This means that block patterns allow open up a wide array of possibilities for the theme developer.

    In this session we will look at the different types of block patterns that can be created, the various ways that block patterns can be registered for a theme, and then create a few block pattern examples for some common theme requirements.

    Presentation Slides »

  • Let’s code: creating custom templates and template parts

    Speaker: Jonathan Bossenger

    October 14, 2022 — WordPress 6.1 will include ways to create custom templates and template parts for your block theme from the Site Editor. These custom templates and template parts are useful when you need to display specific posts or pages using templates that don’t form part of the template hierarchy.

    In this session, we’ll look at both how you can register and create custom templates and template parts from the editor, as well as how to register them in your theme.json file when distributing your new block theme.

    Presentation Slides »

  • Let’s code: creating your primary templates in the Editor

    Speaker: Jonathan Bossenger

    September 30, 2022 — WordPress theme development follows the WordPress template hierarchy, which determines which templates are used depending on the content being rendered.

    Fortunately for the new block theme developer, the Site Editor allows you to create all the primary templates you might need, right from your WordPress install.

    In this session, we’ll start with a quick review of the WordPress template hierarchy. Then we’ll create a blank block theme, using the Create Block Theme plugin, apply some ready-made default styles via theme.json, and create all the primary templates a WordPress theme would need.

    Presentation Slides »

  • Let’s code: what happens when you make theme changes?

    Speakers: Jonathan Bossenger, Thelma Mutete

    September 16, 2022 — Being able to edit a theme in the Site Editor is handy, especially if you’re using it as the base for a new theme. But where do those changes get saved? What happens when you make changes to Global Styles, Block styles, Theme template files, and template parts? What happens when you make changes to the theme files, and changes to the Site Editor; which take precedence? In this session, we’ll be answering these questions.

    Presentation Slides »

  • Let’s code: a beginners guide to block locking in block themes

    Speakers: Jonathan Bossenger, Álvaro Gómez

    September 12, 2022 — One of the concerns that developers voiced regarding Block Themes and the Site Editor is that it gives users too much freedom to edit the site design, select colors, or modify blocks. More complex websites with many editors and departments who produce content need guardrails to enforce publishing standards and adherence to brand color schemas and design systems.

    In this session, we’ll be looking at the Block Locking options available in WordPress, and show you how you can restrict your Block Themes from user interference.

    Presentation Slides »