single-post.html
header

Post Edit block

Here are three examples of the Post Edit block, with different alignments, links, line-heights and background colours/gradients. If you’re not logged in you won’t see the links. So here’s the screenshot as well.

Screenshot for the Post Edit block

Align left

Post Edit block

  • Align: center
  • 36px font, line-height 1.5

Align right

The block uses block.json to add support for colors and typography.

{
        "apiVersion": 2,
        "name": "oik-sb/sb-post-edit-block",
        "title": "Post Edit block",
        "category": "widgets",
        "icon": "edit-page",
        "description": "Post edit block to allow direct editing of the post",
        "attributes": {
          "textAlign": {
                "type": "string"
          },
          "label": {
                "type": "string",
                "default": "(Edit)"
          }
        },
  "supports": {
        "html": false,
        "color": {
          "gradients": true,
          "link": true
        },
        "typography": {
          "fontSize": true,
          "lineHeight": true
        }
  },
        "textdomain": "sb-post-edit-block",
        "editorScript": "file:./build/index.js",
        "editorStyle": "file:./build/index.css",
        "style": "file:./build/style-index.css"
}
 

References

bobbingwide/sb-post-edit-block

Block Editor Handbook: Metadata

WordPress version: 5.7.2

Gutenberg version: 11.0.0

© Copyright Herb Miller, Bobbing Wide 2021