Pattern Importer
Paste in a pattern and download images in one go.
Pattern Importer
The Pattern Importer block allows you to paste and display any block pattern code in the block editor. It is specifically designed for GenerateBlocks, but it can also accommodate other patterns.
Any remote images found in the pattern will be downloaded locally, and the image source will be updated.
Why download remote images? Using remote images is not ideal because the images are not in the site owner's control and can't be compressed or cached. Remote images can also be deleted or modified by a third party. Hosting the images locally on your site prevents any of these conflicts.
In addition to gathering the remote images, the Pattern Importer also replaces the GenerateBlocks uniqueId attributes to prevent style conflicts. If you've ever duplicated a block and had style conflicts, this will alleviate any matching unique IDs.
Adding the Pattern Inserter Block
You can find the Pattern Inserter block where you can find the other GenerateBlock blocks, which is grouped in a GenerateBlocks category.
To copy a pattern, select the blocks that are part of the pattern, click on the vertical ellipses symbol, and click "Copy blocks." This will copy the block pattern code to your clipboard.
You can now paste the pattern code into the Pattern Inserter block. If there are a lot of images, this may take a few minutes to finish. Once imported, the Pattern Inserter block is removed and replaced with the converted pattern.
Last updated
