Questions tagged [metalsmith]

Metalsmith is an extremely simple, pluggable static site generator.

Overview

Metalsmith is a pluggable static site generator.
All its is handled by plugins. You simply chain them together.

Example for a simple blog :

Metalsmith(__dirname)
  .use(markdown())
  .use(templates('handlebars'))
  .build();

Here is a list of the available plugins :

  • AUTOPREFIXER : Automatically add vendor prefixes to CSS.
  • ASSETS : Include static assets in your build.
  • BRANCH : Run separate metalsmith pipelines on selected files.
  • BUILD DATE : Add a build date, for things like feeds or sitemaps.
  • CLEAN SCRIPT : Generate a script to cleanup the build directory, if you are adding more than just Metalsmith files.
  • COLLECTIONS : Group files together, like blog posts. That way you can loop over them to generate an index, or add 'next' and 'previous' links between them.
  • COFFEE : Compile CoffeeScript files to Javascript.
  • COPY : Copy and rename files.
  • DRAFTS : Hide any files marked as drafts.
  • ENCODE HTML : Easily encode HTML entities in any HTML file by surrounding target code in triple backticks.
  • EXCEPT : Omit attributes from each file's metadata.
  • EXCERPTS : Extract the first paragraph from the beginning of any Markdown file.
  • FILE METADATA : Add metadata on files based on a pattern
  • FINGERPRINT : Insert a hash of the content into the file name.
  • GULPSMITH : Use Gulp plugins in Metalsmith, or Metalsmith as a Gulp plugin. Useful for uploading files, reading less than an entire directory tree, using external front matter, etc.
  • HEADINGS : Extract headings from HTML files and attach them to the file's metadata. Useful for automatically building navigation for a document.
  • IGNORE : Ignore any files that match a pattern.
  • INCLUDE : Make other source files available as properties.
  • LESS : Convert LESS files to CSS.
  • MARKDOWN : Convert Markdown files to HTML.
  • METADATA : Load metadata from JSON or YAML files.
  • MORE : Stores the content before the "more" comment tag in HTML files.
  • ONLY : Filter out attributes from each file's metadata.
  • PAGINATE : A simple plugin that uses metalsmith-collections to create a paginated collection.
  • PERMALINKS : Apply custom permalinks and rename files to be nested properly for static sites, basically converting about.html into about/index.html.
  • PROMPT : Prompt the user for series of answers in the command line and add them to the global metadata.
  • REPLACE : Replace attribute values in each file's metadata.
  • SASS : Convert Sass files to CSS.
  • SHORTCODES : Render wordpress-esque shortcodes via templates.
  • STATIC : Copy public assets into the build directory.
  • STYLUS : Convert Stylus files to CSS.
  • TITLE : Automatically generate a page title from first heading in each file.
  • TEMPLATES : Render any file through a templating engine of your choice.
  • UGLIFY : Uglifies/minifies your JavaScript files
  • WATCH : Watching for file changes and trigger rebuilds.
  • WEBPACK : Bundle CommonJS, AMD and ES6 modules.

Links

59 questions
5
votes
1 answer

How to access rootPath set from gulp task from within angular application

I have the following task that build my application: const app = new Metalsmith(config.styleguide.path.root); app.use( msDefine({ production: false, rootPath: '/' }) ); app.use( msIf( …
Alex C
  • 1,334
  • 2
  • 18
  • 41
5
votes
2 answers

How do I deep compile nested handlebars content?

A project I'm working on uses Handlebars.js template system. It reads in content and when compiling the template injects the content where appropriate:

lorem ipsum

{{{ content }}}
In this case the…
Sukima
  • 9,965
  • 3
  • 46
  • 60
4
votes
1 answer

Metalsmith layouts causes "no files to process" error

I conscientiously followed the tutorial on official community driven docs but failed to compile project on using Handlebars and metalsmith-layouts. "Metalsmith · no files to process" error occurred. Here is my directory structure: . ├── src │ └──…
isari
  • 43
  • 2
4
votes
1 answer

How to use Nunjucks' partials / macros / includes with metalsmith-in-place?

I'm having trouble reusing template code within my markdown files. For example I'd like to pull in the embed code for vimeo links and just pass the vimeo id to the call. One example macro: {% macro vimeoEmbed(id) %}
Js.
  • 423
  • 3
  • 13
4
votes
0 answers

Multilingual website with Metalsmith

I've tried different combinations of plugins for Melatsmith but still need help. Could you suggest how to transform structure like this: src/ pages/ about/ index_de.md index_en.md contact/ index_de.md index_en.md …
Varvara Stepanova
  • 3,489
  • 4
  • 22
  • 26
4
votes
1 answer

Handlebars wraps

I am trying to get my metalsmith setup working, nothing fancy. In my build.js I have: … handlebars.registerHelper('doctype', function() { return new handlebars.SafeString(''); }); … in my partial template header.hbt I…
4
votes
3 answers

How do I set up multiple content areas in metalsmith?

I have a very simple use case for metalsmith that doesn't seem to be covered by any readily available documentation. In my index.html I want multiple content areas:
andyhasit
  • 14,137
  • 7
  • 49
  • 51
4
votes
1 answer

Metalsmith static site pages are missing metadata

I've been attempting a tutorial to set up Metalsmith, and I've gotten to the end of part 1. I've install node.js and modules. The IDE is Visual Studio 2013 with Node.js tools installed. I've put a basic structure in and I'm trying to get a single…
James Khoury
  • 21,330
  • 4
  • 34
  • 65
3
votes
2 answers

Handlebars treating {{path}} as relative rather than absolute link

I'm making a website with Metalsmith that is templated with Handlebars. I made an archive page named /articles/index.html, which takes all the articles in /articles/ and lists them chronologically, but when I follow a link in the archive page it…
Peter
  • 33
  • 6
3
votes
0 answers

Metalsmith-permalinks failing to add path to metadata

I'm using metalsmith-permalinks with the following settings: .use(permalinks({ pattern: ':title', linksets: [{ match: { collection: 'blogposts' }, pattern: 'blog/:title' }, { match: { collection: 'portfolioposts' }, pattern:…
3
votes
3 answers

What's wrong with this metalsmith-in-place build script?

I am trying to use metalsmith-in-place to do some in-place templating on files in subdirectories of my source dir. It doesn't work. Template tags are not replaced by the frontmatter. My build script: var Metalsmith = require('metalsmith'), inplace…
hoosteeno
  • 644
  • 5
  • 17
3
votes
1 answer

Metalsmith: How to use path()?

Metalsmith's documentation does not explain much about the path() function: #path(paths...): Resolve any amount of paths... relative to the working directory. This is useful for plugins who want to read extra assets from another directory, for…
James Harkins
  • 99
  • 1
  • 6
3
votes
1 answer

metalsmith-collections 'path' key not accessible from Handlebars template?

My template: {{#each collections }} {{ @key }} {{#each this }} {{ this.title }} {{/each}} {{/each}} Renders ( this.path is undefined ):
tgk
  • 3,857
  • 2
  • 27
  • 42
3
votes
1 answer

Metalsmith.js: How to build to same directory as build script?

I am completely new to metalsmith. I've been following this tutorial: http://www.robinthrift.com/post/metalsmith-part-1-setting-up-the-forge/ I want to build my site to the root directory of my project (the same dir as the build script). I want to…
Kyle Paulsen
  • 956
  • 1
  • 8
  • 22
3
votes
1 answer

Metalsmith static site generator: How to make the URL of the page: one/two/three?

How to make the URL of the page: one/two/three? This work must be done via a url variable in the template. I use metalsmith-permalinks plugin. I have it hooked up and the pattern is specified as :url. Later in the template write the url:…
1
2 3 4