A common need is to share component layout between multiple compositions. Patterns let you do this by defining a pattern composition that can then be referenced by other compositions anywhere that the pattern's component type is allowed. For example, you could use a pattern to share a legal disclaimer, an author bio, or standard global header across many compositions.
There are two ways to create a pattern:
- In the Canvas sidebar, click on the Pattern Library and then add a pattern of any type with the red (+) button.
- When editing a composition, click the
...menu on any component within it and choose Convert to Pattern to turn that component and any of its children into a pattern.
You can use a pattern like a regular component by adding it to a composition in a slot. If patterns are available they will appear when you insert a component into a composition in the add to slot list.
Change a pattern
Once a pattern is referenced on a composition, the pattern's component(s) are shown but can't be edited. This is to prevent editing shared component data inadvertently.
To edit a pattern, which will change it everywhere it's referenced, you can:
- Click the
...menu on a referenced pattern in a composition and choose Edit Pattern to open the pattern for editing.
- Find the pattern in the Pattern Library and open it for editing.
Sometimes you may wish to 'unlink' from a pattern and make a copy of its contents.
This lets you make a copy of the pattern that can be changed without affecting the original pattern; the copy will no longer have any relation to the pattern.
To do this from the composition editor, click a referenced pattern's
... menu and choose Copy Pattern. The copy will be expanded in place.
There are some limitations of where and how you can use patterns that you should be aware of.
- Creating a pattern from a component type, such as Personalization, Localization, or A/B Test, which inherits its allowed components from a parent slot isn't allowed. This is because you can't determine the components allowed in the pattern with no parent slot.
- Patterns can't be added as children of an A/B Test or Localization.
- You can't reference a pattern as the root component of a composition
Draft and published states in patterns
It can get a little confusing when editing patterns and compositions, especially when you're not ready to make changes live right away. Here's a rundown of how compositions are fetched with draft or published compositions and patterns.
|Fetch composition (draft)||Fetch composition (published)|
|Draft pattern & draft composition||Returns both in draft state||Returns a 404|
|Draft pattern & published composition||Returns both in latest draft state||Returns composition but “pattern not found” error for pattern|
|Published pattern & published composition||Returns both in latest draft state||Returns both in published state|
|Changed pattern & published composition||Returns both in latest draft state||Returns composition in published state, pattern in last published state|