Blocks

A block is a self-contained component/section. Blocks are created using ACF Blocks. Each block has its own template, script and style files.

Below is an example block, which is located in blocks/Example.

Example
┣ Block.php
┣ block.json
┣ editor.twig *
┣ index.twig
┣ script.js
┗ style.css

To create a new block, create a directory in blocks with the BlockName in PascalCase. Add your index.twig, block.json, Block.php, and optional style.css, and script.js files and it's ready to be used with the WordPress block editor. You can add editable fields by creating a new ACF field group and setting the location rule to your new block. You can now use these fields with your block in the block editor.

Use can also use the command og make:block (optional)Category BlockName from og-cli to automatically generate the necessary and optional files for a new block. Note: The block name must be PascalCase.

The optional style.css and script.js files for a block should be deleted if they are not used. This will prevent multiple empty files from being compiled during the build process.