In the last couple of posts I discussed the details of integrating Netlify CMS with Metalsmith. In this post I'll provide an overview of how to use Forestry for content editing with Metalsmith. Forestry.io is a Git-backed CMS for websites and web products that are built with static site generators. Just like Netlify CMS, Forestry provides an editor-friendly interface for Git.
Forestry has a free plan for personal projects with no credit card required.
We'll be using the Metalsmith Forestry Starter to set up Forestry CMS.
After we have signed up for an account, we'll add a site to our account by clicking the Add Site button in our dashboard.
The initial steps to import the site code from our Git providert are well explaioned in Forestry's docs so I'll not repeat this here.
Configure the site
Once the site has been added we can configure the site. If you have followed the steps in the Forestry article you should see your site's dashboard.
The Metalsmith Forestry Starter has two folders that we want to edit, the
content and the
data folder. The
content folder contains all pages and the
data folder contains the site meta data and the navigation data.
We will add them to the sidebar for easy access.
Click the Configure Sidebar button, then the Add Section button in the sidebar dashboard and select Directory.
Add the info as shown below
Here we say that we want to all files to be shown and that we allow creation of files and folders. Files will be in markdown format.
Note that we exclude the data folder for this display. We will add this folder separately to the sidebar.
Add the data section
Once these two items are setup, click the Save button before you leave the sidebar section.
The repository section will be filled in already, nothing to do here.
The Metalsmith Forestry Starter commits all images to Git. The starter does not use many images so this is not an issue. For websites with many images I recommend to use Cloudinary. That makes it very simple to implement responsive images.
Select Node, click Select and fill in the configuration fields as shown below, then click Save
Now your sidebar should look like this. You are ready to edit your site. Click on Content in the sidebar and you'll see the pages of the starter. Click on
index.md to see the home page.
Forestry will show the page with the frontmatter on the left and the page body on the right. There is no template applied.
We can create a template from this page by simply clicking on the three dots in the upper right corner and selecting Create Template. Name this template Simple. Now you can find the template under Frontmatter in the sidebar. Read all there is to know about Frontmatter templates here.
This should get you started with editing your Metalsmith site with the Forestry CMS.
Here are some suggestions for further reading:
If you have any questions about this post please chat with me on Gitter.