Patterns, are the cookie cutter of the block editor, they allow you to add an identical design across a site without having to assemble the individual blocks or apply styles.
Considering the extreme depth of design potential that GenerateBlocks provides; Patterns are one of the most important workflow tools available to you. To acknowledgement that we built our own Pattern Library to get you started and to continue using throughout your web builds.
Patterns, a quick overview
If you’re not familiar with using Patterns in WordPress then we recommend you check out the resources over at Learn WordPress.
In this article we will be discussing who the GenerateBlocks Pattern Library uses patterns, its benefits and how to use it. Let’s begin by covering some basics.
GenerateBlocks Patterns are WordPress Patterns
Aside from the taxonomies that we add for managing Pattern Libraries , GenerateBlocks Patterns uses the core WordPress Patterns function. So it doesn’t matter where or how you create a pattern, they are all the same.
Regular Patterns vs Synced Patterns
A Regular pattern adds a copy of their blocks to your post content. These blocks are not connected to the original pattern, so each instance can be modified independently of the others. The GenerateBlocks Pattern Library contains only Regular patterns.
Synced patterns add a dynamic block to the post content which displays a pattern inside it. Each instance of the block is synced and editing one instance will update all instances. The only way to add a synced pattern is via the regular WordPress block inserter. The GenerateBlocks Pattern library will output them as regular patterns.
Free vs Pro Patterns
Pattern Libraries are available in both the Free and Pro versions of the GenerateBlocks plugin.
The Patterns are of a mid-fidelity design, that provide 100% responsive layouts, that are easy for you to add your our own style opinion.
GenerateBlocks Free provides a reduced set of just the essential patterns. Each pattern uses minimal local block styles for things such as spacing and padding, The majority of the blocks typography and color styles are left as default so they will typically inherit those from your theme.
GenerateBlocks Pro provide a much larger set of Patterns, just over 200 at this time. The significant difference between these and their Free version is the use of Global Styles. You can find more information in the Pro Patterns Style Reference.
Opening the Pattern Library
Now we got that out of the way let’s take a look at how simple it is to start working with GenerateBlocks Patterns.
The first step is to open the pattern library from any editor screen:
- Open the GenerateBlocks Panel in by clicking the GB button in the editor Top Bar
- Inside the panel click the Open Pattern Library button
Pattern Library overview
The GenerateBlocks Pattern Library provides some unique features. Allowing users to maintain their own libraries, search & filter the pattens by category, preview patterns with responsive views as well as individually insert of bulk insert patterns.
-
1. Library Selector
Each available library is represented by its own tab at the top of modal. Select a tab button to view that Library. Other available libraries such as the Local Library or one from a GenerateCloud server can be added used + add libraries button.
-
2. Refresh cache
To maintain good performance remote Pattern Libraries are cached. If after an update the correct patterns are not being displayed then you may need to clear the cache. You can clear the cache once every
5 minutes. -
3. Manage Libraries
The Mange Libraries allows you to set which Libraries are displayed including the default Free or Pro libraries, any Local libraries as well as those from a GenerateCloud Server.
Manage the pattern libraries -
4. Category Search & Filter
a basic category filter allows you to quickly find categories of patterns. In the bulk inserter mode, only the Search option Is displayed.
-
5. Bulk insert mode
You may need to insert multiple patterns into a post. With the Bulk Insert option, you can create and reorder a list of patterns, then insert them all at once, saving you multiple trips to the library.
-
6. Insert Pattern
The button to Insert the attached pattern.
-
7. Preview Pattern
Open a large screen responsive preview of the attached pattern.