Using the Pattern Library

The Pattern Library is a collection of premade components created to provide quick and easy content options for Govstack CMS users. It is stored in your website as a page template that you can access at any time by creating a new page.

Once you've created a Pattern Library page you can copy any of the premade content components to your own webpages using the Govstack clipboard.

Creating a Pattern Library page

To access the premade components of the Pattern Library you'll need to create a webpage from its template. Follow these steps:

1. Open the Govstack back office and navigate to the Content section
2. Right-click the parent node for your new Pattern Library page. We recommend using the Home node. This page is temporary and is hidden from the navigation by default so its location isn't critical. Place it somewhere you can find it easily so you can review content and delete it once you're done with it
3. Select 'Create' from the page options menu
4. Select 'Page' from the list of node types
5. Select 'Pattern Library' from the list of available page templates
6. Your new Pattern Library page will open in the editing area. You can rename your page if you wish but leaving it as 'Pattern Library' is fine. These pages are usually deleted once the components are copied so the name is not critical
7. Select the 'Save' button at the lower left of the page to complete the process

You can now open and review the content of the page to find the premade components you want to copy and use on your own web pages.

Reviewing the content of the Pattern Library

To identify the component or components you want to copy for use on your own web pages you'll need to open your Pattern Library page and review the options available.

To review the options in the Pattern Library follow these steps:

1. Open the Govstack back office and navigate to the Content section
2. Locate your Pattern Library node in the content tree and select it
3. Select the 'Save and preview' button at the bottom right of the page. This will open a preview of the page content for review in a new browser tab. If the tab doesn't open make sure that you don't have a popup blocker active
4. In the new browser tab review the components and decide which ones you want to copy for use on your own pages. Note the names at the top of these components. These will match the componenet labels in the Govstack back office

Copying content from the Pattern Library

Once you have identified which components you want to use on your pages you will need to copy them to your clipboard and paste them to their destination pages.

To copy and paste Pattern Library content follow these steps:

1. Open the Govstack back office and navigate to the Content section
2. Locate your Pattern Library node in the content tree and select it
3. In the Main content section of your page locate the components you want to copy. The names of the components should match (or be very close to) the labels on the preview page
4. On each component select the copy button to add it to your clipboard. You will receive a notification that each component has been added to your clipboard 
   
5. Navigate to the page where you want to paste your copied content
6. Select the clipboard icon at the right of the 'Add content' button. Note that the icon will not appear until you move your mouse over the button
7. Your clipboard will open. Select the component to paste
8. Your clipboard will close and the selected component will appear at the bottom of your content list
9. Dag the component to its correct location in the page content then edit the component as required. Don't forget to replace the default placeholder content from the Pattern Library with your own
10. Repeat these step for each component you want to paste

As you complete your pages don't forget to save and publish your work.

Deleting the Pattern Library

Once you are done with the Pattern Library page you can delete it. If you need more components in the future you can always create another Pattern Library page using the instructions provided above.

Pattern Library pages have their delete option locked by default so there are a few extra steps involved with removing them:

1. Open the Govstack back office and navigate to the Content section
2. Locate your Pattern Library node in the content tree and select it
3. Open the 'Advanced' tab at the top of the page
4. Scroll to the bottom of the Advanced options and set the 'Disable delete' toggle to 'No'
5. Select 'Save' at the bottom of the page
6. Right click the Pattern Library node in the content tree
7. Select 'Delete' from the node options menu
8. Select 'OK' in the confirmation dialogue to complete the process