Creating a pattern in McConimore 2.0 on WordPress

Build a block completely styled and then save it as a pattern. The difference between a synced pattern and an unsynced pattern is that when you edit a synced pattern those changes are made globally to all duplicated patterns used throughout the site.

  1. 1. To make a pattern that you would like to use several times throughout the website, you must first build the pattern using blocks. The steps below will show how this pattern was built.

    To make a pattern that you would like to use several times throughout the website, you must first build the pattern using blocks. The steps below will show how this pattern was built.
  2. 2. Click on Columns

    Click on Columns
  3. 3. Click on Three columns; equal split

    Click on Three columns; equal split
  4. 4. Click on Change block type or style to wrap the column block into a group.

    This is important so you can set a content width for the column block within the group layout/styling panes.

    Click on Change block type or style to wrap the column block into a group.
  5. 5. Click on Group

    Click on Group
  6. 6. Click on Group

    Click on Group
  7. 7. Click on Columns

    Click on Columns
  8. 8. Click on Column

    Click on Column
  9. 9. Click on Add block

    Click on Add block
  10. 10. Type "image"

    Type "image"
  11. 11. Click on Image

    Click on Image
  12. 12. Click on Upload

    Click on Upload
  13. 13. Select an image from file upload menu

    Select an image from file upload menu
  14. 14. Click on Toggle block inserter

    Click on Toggle block inserter
  15. 15. Click on Heading

    Click on Heading
  16. 16. Type Benefits

    Type Benefits
  17. 17. Type Block: Paragraph

    Type Block: Paragraph
  18. 18. Type Block: Paragraph

    Type Block: Paragraph
  19. 19. Click on Document Overview

    Click on Document Overview
  20. 20. Click on Spacer

    Click on Spacer
  21. 21. Set spacer height in pixels

    Set spacer height in pixels
  22. 22. Click on Document Overview

    Click on Document Overview
  23. 23. Click on Toggle block inserter

    Click on Toggle block inserter
  24. 24. Type "button"

    Type "button"
  25. 25. Click on Buttons

    Click on Buttons
  26. 26. Type Button text

    Type Button text
  27. 27. Working through the pattern and use inline styling to set the look and feel you want to attain in the pattern

    Be sure to consider the global styling of the site if you are making extensive changes across your pattern builds.

    Working through the pattern and use inline styling to set the look and feel you want to attain in the pattern
  28. 28. Click on Align text center

    Click on Align text center
  29. 29. Repeat the pattern in the other two columns

    This can be done quickly by copying the elements within the column in the Document Overview (three line icon) and pasting the elements into the empty columns

    Repeat the pattern in the other two columns
  30. 30. Align the elements to the center

    Image can be aligned by clicking on the element and selecting "align center."

    Align the elements to the center
  31. 31. Click on Change text alignment

    Click on Change text alignment
  32. 32. Click on Align text center

    Click on Align text center
  33. 33. Click on Column Cards with Buttons

    Click on Column Cards with Buttons
  34. 34. Click on Options

    Click on Options
  35. 35. Click on Create pattern

    Click on Create pattern
  36. 36. Type "Column Cards with Buttons"

    Type "Column Cards with Buttons"
  37. 37. Type "McConimore"

    Type "McConimore"
  38. 38. Click on Add New Pattern…

    Click on Add New Pattern…
  39. 39. Choose to Unsync by sliding the toggle away from Synced.

    Duplicated unsynced patterns can be individually editing without changing the rest of the same pattern across the website.

    Choose to Unsync by sliding the toggle away from Synced.
  40. 40. Click on Add

    Click on Add
  41. 41. Click on Toggle block inserter

    Click on Toggle block inserter
  42. 42. Click on Patterns

    Click on Patterns
  43. 43. Click on My patterns

    Click on My patterns
  44. 44. Click on Column Cards with Buttons

    Click on Column Cards with Buttons
  45. 45. Click on Save

    Click on Save

Tango

  1. 46. Click on View Page

    Click on View Page