Metalsmith Site Starter

Download this starter to expedite building your Metalsmith site with the sectioned page paradigm. The starter helps you to build fast, robust and adaptable websites. The knowledge and experience of many web developers are reflected in this system. You can checkout a demo here.

Content is written in Markdown and templates are coded with Nunjucks. All page content is defined in the frontmatter of each page. There are no long-text markdown sections. Rather, content text area fields in the page frontmatter are compiled into HTML with a Nunjucks filter.

Styles are written in SCSS, scripts in Javasript and compiled with Metalsmith plugins. The bolierplate includes Normalize.css which makes browsers render all elements more consistently and in line with modern standards. It precisely targets only the styles that need normalizing.

Page sections are defined as YAML objects in the frontmatter. This approach lends itself to an easy integration with headless CMSs like Netlify CMS or forestry.io. Get more detailed explanations in this blogpost.

This website provides page sections and base components. The page sections are bare-bones interpretations of universal information presentation patterns that can be found on almost every corporate website. Sections are composed of base components and are used to build complete pages. The base components can also be used independently to build new components.

All images are served from Cloudinary.

If you have built a new component that you think would be useful for other developers, please issue a pull request.