contentful-metalsmith-example

An example to showcase the integration of Metalsmith and Contentful by using a metalsmith plugin: contentful-metalsmith.

About

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.

Usage

1. Clone and install the project dependencies

  $ git clone git@github.com:contentful/contentful-metalsmith-example.git
  $ cd contentful-metalsmith-example
  $ npm install

2. Run metalsmith

  # for building once
  $ npm run build

  # 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

  # for running a http server in production mode
  $ npm start

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 contentType author
• index.html, shows a list of entries with contentType article and rendered child pages for every article
• images.html, shows a list of entries with contentType image but for a completely different space, which can become handy when you use several spaces.
• filtered.html, shows a list of entries filtered by keyword rabbit
• article/*.html, shows one entry resulting of rendering all articles

For more info on the capabalities of the plugin visit its repo.