← Main site

Block Editor

Tabule Theme is fully compatible with the WordPress block editor (Gutenberg). Theme colors, fonts, and layout settings defined in the Customizer are also registered in theme.json, so the editor matches your site's visual design.

What theme.json provides

  • Color palette — the primary color (#6f8e1d), secondary (#343a40), accent (#1e73be), and neutral shades are available as named color swatches in the block editor.
  • Font sizes — Small (14px), Normal (17px), Medium (20px), Large (26px), and X-Large (34px) are registered as named sizes.
  • Layout widths — the content width is set to 860 px and the wide width to 1200 px, matching the theme's container settings.
  • Default styles off — WordPress default block styles (borders, shadows) are disabled to avoid visual conflicts with the theme's own CSS.

Editor stylesheet

The theme loads an editor-style.css file in the block editor that mirrors the frontend typography and spacing, so what you see in the editor closely matches the published result.

Disabling the block editor

If you prefer the Classic Editor workflow, go to Appearance → Tabule → Settings → Performance and enable Disable Gutenberg (enable Classic Editor). This will:

  • Switch all post types back to the Classic Editor.
  • Remove block editor CSS from the frontend (saving ~50–80 KB per page).
  • Disable the block-based widget screen.
⚠️

When the block editor is disabled, theme.json colors and font sizes will no longer appear in the editor since the block editor itself is not loaded.

Custom blocks and plugins

Tabule Theme works with any block plugin (Kadence, GenerateBlocks, Spectra, etc.). The theme's CSS does not interfere with block-level styles. If you find a visual conflict, add your override in the child theme's style.css.