Skip to content

d2x/contentful-metalsmith-example

 
 

Repository files navigation

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 Blog Example

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 [email protected]:contentful/contentful-metalsmith-example.git
  $ cd contentful-metalsmith-example
  $ npm install
  1. 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 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.

About

Simple project to show the usage of the contentful-metalsmith plugin

Resources

Stars

Watchers

Forks

Packages

No packages published

Languages

  • HTML 65.0%
  • CSS 22.5%
  • JavaScript 12.5%