All patterns with a ✅ in front of their titles are in the theme.
Heading – Two column layout, with left image, text, and button
2022-08-29, Rob: isn’t this the same as “Media & Text with button” pattern below? If we have patterns that are too similar, we’ll confuse site editors.
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin varius lacus urna, nec accumsan ligula tempor eu. Duis efficitur mi est, eget eleifend ligula imperdiet quis. Mauris facilisis vestibulum arcu, non efficitur felis hendrerit nec. Cras in congue enim, et malesuada lectus.
✅ Media & Text with Button
Here is a heading with text and a button call to action. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin varius lacus urna, nec accumsan ligula tempor eu. Duis efficitur mi est, eget eleifend ligula imperdiet quis. Mauris facilisis vestibulum arcu, non efficitur felis hendrerit nec. Cras in congue enim, et malesuada lectus. Etiam eget ante eu turpis aliquam lacinia non ac ligula.
✅ Heading of Two Column Layout
First Column
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin varius lacus urna, nec accumsan ligula tempor eu. Duis efficitur mi est, eget eleifend ligula imperdiet quis. Mauris facilisis vestibulum arcu, non efficitur felis hendrerit nec. Cras in congue enim, et malesuada lectus. Etiam eget ante eu turpis aliquam lacinia non ac ligula. Quisque hendrerit, tortor nec accumsan cursus, neque nisl aliquam sem, euismod volutpat erat nisi at enim.
Second Column
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin varius lacus urna, nec accumsan ligula tempor eu. Duis efficitur mi est, eget eleifend ligula imperdiet quis. Mauris facilisis vestibulum arcu, non efficitur felis hendrerit nec. Cras in congue enim, et malesuada lectus. Etiam eget ante eu turpis aliquam lacinia non ac ligula. Quisque hendrerit, tortor nec accumsan cursus, neque nisl aliquam sem, euismod volutpat erat nisi at enim.
✅ Three column layout, with images, text, and buttons
Lorem ipsum dolor sit amet, consectetur adipiscing elit.
Lorem ipsum dolor sit amet, consectetur adipiscing elit.
Lorem ipsum dolor sit amet, consectetur adipiscing elit.
✅ Group of alternating media rows
Heading
Here is a heading with text and a text link for a lower priority call to action. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin varius lacus urna, nec accumsan ligula tempor eu. Duis efficitur mi est, eget eleifend ligula imperdiet quis. Mauris facilisis vestibulum arcu, non efficitur felis hendrerit nec. Cras in congue enim, et malesuada lectus. Etiam eget ante eu turpis aliquam lacinia non ac ligula. Quisque hendrerit, tortor nec accumsan cursus, neque nisl aliquam sem, euismod volutpat erat nisi at enim.
Text link call to action
Heading
Here is a heading with text and a text link for a lower priority call to action. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin varius lacus urna, nec accumsan ligula tempor eu. Duis efficitur mi est, eget eleifend ligula imperdiet quis. Mauris facilisis vestibulum arcu, non efficitur felis hendrerit nec. Cras in congue enim, et malesuada lectus. Etiam eget ante eu turpis aliquam lacinia non ac ligula. Quisque hendrerit, tortor nec accumsan cursus, neque nisl aliquam sem, euismod volutpat erat nisi at enim.
Text link call to action
Heading
Here is a heading with text and a text link for a lower priority call to action. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin varius lacus urna, nec accumsan ligula tempor eu. Duis efficitur mi est, eget eleifend ligula imperdiet quis. Mauris facilisis vestibulum arcu, non efficitur felis hendrerit nec. Cras in congue enim, et malesuada lectus. Etiam eget ante eu turpis aliquam lacinia non ac ligula. Quisque hendrerit, tortor nec accumsan cursus, neque nisl aliquam sem, euismod volutpat erat nisi at enim.
Text link call to action
✅ Call to Action
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin varius lacus urna, nec accumsan ligula tempor eu.
Secondary navigation examples
[70/30 column split with text, separator lines and non-dynamic navigation]
[70/30 column split with text, separator lines and dynamic navigation]
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin varius lacus urna, nec accumsan ligula tempor eu. Duis efficitur mi est, eget eleifend ligula imperdiet quis. Mauris facilisis vestibulum arcu, non efficitur felis hendrerit nec. Cras in congue enim, et malesuada lectus.
Secondary navigation
[70/30 column split with heading, bullet points and non-dynamic navigation]
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin varius lacus urna, nec accumsan ligula tempor eu. Duis efficitur mi est, eget eleifend ligula imperdiet quis. Mauris facilisis vestibulum arcu, non efficitur felis hendrerit nec. Cras in congue enim, et malesuada lectus.
Cover image with a space for a headline