An example to showcase the integration of Metalsmith and Contentful by using a metalsmith plugin: contentful-metalsmith.
The goal of this project is to show how easily you can create static sites using the content (text, images, links, etc.) stored on Contentful. This project is configured to fetch data from a public space using Contentful's Content Delivery API.
The result is a blog site including several posts and authors.
It also uses handlebars templates for templating and sass for writing CSS.
- Clone and install the project dependencies
$ git clone [email protected]:contentful/contentful-metalsmith-example.git
$ cd contentful-metalsmith-example
$ npm install
- Run metalsmith
# for building once
$ npm start
# for development and constant building
# starts watchers to react to file changes,
# spawns an http server and opens the built
# site in your browser
$ npm run dev
After running metalsmith you will have several files into the build
dir. Each of this files demonstrate a capability of the contentful-metalsmith plugin:
authors.html
, shows only entries with contentTypeauthor
index.html
, shows a list of entries with contentTypearticle
and rendered child pages for every articleimages.html
, shows a list of entries with contentTypeimage
but for a completely different space, which can become handy when you use several spaces.filtered.html
, shows a list of entries filtered by keywordrabbit
article/*.html
, shows one entry resulting of rendering all articles
For more info on the capabalities of the plugin visit its repo.