WordUp Pompey!

WordPress Portsmouth Meetup

Block and section styles

WordPress 6.6 introduced support for styles defined using JSON files. These are loaded automatically.

Default Heading

paragraph

A link in a paragraph

Spaced CAPS

paragraph

A link in a paragraph

styles/spaced-caps.json

The Spaced CAPS style is available to several blocks:

heading, post date, paragraph and author name.

All the text is capitalised.

The letter spacing is set to 0.14em

When you hover over a link then the underscoring is removed.

{
  "version": 3,
  "$schema": "https://schemas.wp.org/trunk/theme.json",
  "title": "Spaced CAPS",
  "slug": "spaced-caps",
  "blockTypes": [
    "core/heading",
    "core/post-date",
    "core/paragraph",
    "core/post-author-name",
    "core/post-title"
  ],
  "styles": {
    "typography": {
      "fontWeight": "700",
      "letterSpacing": "0.14em",
      "textDecoration": "none",
      "textTransform": "uppercase"
    },
    "elements": {
      "link": {
        ":hover": {
          "typography": {
            "textDecoration": "none"
          }
        }
      }
    }
  }
}

References