Future publication
- - -Published 1 March 2016, 16 words, 1-minute read
- - -This article will only appear if the site is built is run after 1 March, 2016.
- - - - - - -diff --git a/build/article/future/index.html b/build/article/future/index.html deleted file mode 100644 index 0fb1acc..0000000 --- a/build/article/future/index.html +++ /dev/null @@ -1,103 +0,0 @@ - - - -
- -Published 1 March 2016, 16 words, 1-minute read
- - -This article will only appear if the site is built is run after 1 March, 2016.
- - - - - - -Published 10 March 2016, 127 words, 1-minute read
- - -Not everything is necessarily straight-forward in the Metalsmith world…
-Some plugins clash with another. For example, metalsmith-rootpath which calculates relative roots does not play nicely with metalsmith-permalinks which creates custom folder structures.
-Note: lib/metalsmith-moremeta
in this project sets a correct root
variable whether permalinks are used or not.
One plugins may depend on another or conflict if placed the wrong way around. For example, the RSS-generating metalsmith-feed plugin must be called after metalsmith-layouts to ensure rss.xml
is not generated within a page template.
When Browsersync is running and files are edited, collections are re-parsed but the old data remains. This can cause menus and next/back links to be incorrect. To fix this, stop and restart the build.
- - - - - - -Published 2 March 2016, 141 words, 1-minute read
- - -Metalsmith has plugins for CSS pre-processing with Sass, image minification, file concatenation, uglification and more. The build code will be familiar to anyone with Gulp experience.
-Metalsmith is often enough for simpler workflows. However, Gulp has a more extensive range of plugins and permits complex build activities such as linting and PostCSS processing with auto-prefixer.
-Metalsmith can be used within any Gulp task, e.g.
-var
- gulp = require('gulp'),
- metalsmith = require('metalsmith'),
- publish = require('metalsmith-publish'),
- markdown = require('metalsmith-markdown');
-
-// build HTML files using Metalsmith
-gulp.task('html', function() {
-
- var ms = metalsmith(dir.base)
- .clean(false)
- .source('src/html/')
- .destination('build')
- .use(publish())
- .use(markdown())
- .build(function(err) {
- if (err) throw err;
- });
-
-});
Further Gulp tasks can then be added. Note .clean(false)
ensures Metalsmith never wipes the build folder when other tasks are active.
There are a number of Gulp/Metalsmith integration plugins although they are rarely necessary.
- - - - - - -A selection of articles is available in this section.
- - - - - - -Published 14 March 2016, 47 words, 1-minute read
- - -Metalsmith could be used to create any number of resources, including:
-The markdown files can be converted to other files types using plugins such as metalsmith-pandoc or metalsmith-pdf.
- - - - - - -This section provides an overview of core code and concepts.
- - -Any questions?
-Contact us at Dash DApp Developers Discord
- - -Published 8 March 2020, 55 words, 1-minute read
- - -To build and launch the site in a test server using Browsersync:
-npm start
(Stop the server with Ctrl+C
.)
To build the site for production and compress HTML files:
-npm run production
The site is built in the /build
folder.
Note you may want to change the siteMeta.domain
and siteMeta.rootpath
on lines 52 and 53 of ./build.js
.
This section provides an overview of core code and concepts.
- - - -8 March 2020
- -How to install this demonstration code.
- -8 March 2020
- -How to build the static site using Metalsmith.
- -8 March 2020
- -A description of the source files used to build a website
- -8 March 2020
- -How pages are defined in the source folder.
- -8 March 2020
- -The custom plugins used to create this website.
- -Published 8 March 2020, 27 words, 1-minute read
- - -Please ensure Node.js and Git are installed on your system.
-Download the demonstration code and switch to directory:
-git clone git@github.com:dashdev-suite/dashdev-website.git - cd metalsmith-demo
-Install dependencies:
-npm install
-
-
-
-
-
- Published 8 March 2020, 194 words, 1-minute read
- - -Each sub-folder in src/html
is a website section. Pages named index.md
are the default page in section. File paths are translated to permalinks, e.g.
src/html/article/mypage.md
is rendered to:
-build/article/mypage/index.html
Pages use YAML front-matter defined at the top. This can be referenced in templates or during the build process, e.g.
----
-title: My page title
-description: A description of this page for meta tags and page lists.
-layout: page.html
-priority: 0.9
-publish: 2016-06-01
-date: 2016-06-01
----
All items are optional. Note:
-layout
defaults to page.html
unless metadata.layout
is defined for the page collection (see the use(collections({ ... })
code in build.js
).priority
is a number between 0 (low) and 1 (high) which is used to order menus and define XML sitemaps.publish
can be set draft
, private
or a future date to ensure it is not published until required.date
is the date of the article. If not set, a future publish
date or the file creation date is used.The page content is defined in markdown, HTML syntax or both below the front-matter section. The content can include Handlebars partials from the src/partials
folder, e.g.
{{> partialname }}
where partialname
is the partial filename without its .html
extension.
Published 8 March 2020, 77 words, 1-minute read
- - -The build.js
file defines how the site is built using Metalsmith and various plugins.
Several custom plugins have been created specifically for this site:
-lib/metalsmith-debug.js
: output debugging information to the console.lib/metalsmith-setdate.js
: ensure each page has a date. If a date
is not defined in the page's front-matter, it is presumed to be the publish or file creation date.lib/metalsmith-moremeta.js
: applies further metadata to each page including the root folder, a default layout, primary and secondary navigation.Published 8 March 2020, 57 words, 1-minute read
- - -All files in the src
folder can be edited:
src/html
folder and sub-folders.src/assets
. These are copied without modification to build/
.src/template
.src/partials
.This is a static website generated using the Node.js-powered Metalsmith and various published and custom plugins.
-This is a demonstration rather than a recommended way to build a static site. Your requirements will be different. Please use any part of the code as you wish.
-Metalsmith could be used to create:
-A selection of articles is available in this section.
- - - - - - -A selection of articles is available in this section.
- - - - - - -A selection of articles is available in this section.
- - - - - - -A selection of articles is available in this section.
- - - - - - -A selection of articles is available in this section.
- - - - - - -A selection of articles is available in this section.
- - - - - - -A selection of articles is available in this section.
- - - - - - -A selection of articles is available in this section.
- - - - - - -A selection of articles is available in this section.
- - - - - - -A selection of articles is available in this section.
- - - - - - -A selection of articles is available in this section.
- - - - - - -A selection of articles is available in this section.
- - - - - - -A selection of articles is available in this section.
- - - - - - -A selection of articles is available in this section.
- - - - - - -A selection of articles is available in this section.
- - - -14 March 2016
- -What type of project could benefit from Metalsmith?
- -10 March 2016
- -Issues and workarounds when using Metalsmith.
- -2 March 2016
- -Do you need Gulp? Can it be integrated with Metalsmith?
- -1 March 2016
- -This article will be published after 1 March, 2016.
- -A selection of articles is available in this section.
- - - -14 March 2016
- -What type of project could benefit from Metalsmith?
- -10 March 2016
- -Issues and workarounds when using Metalsmith.
- -2 March 2016
- -Do you need Gulp? Can it be integrated with Metalsmith?
- -1 March 2016
- -This article will be published after 1 March, 2016.
- -A selection of articles is available in this section.
- - - -14 March 2016
- -What type of project could benefit from Metalsmith?
- -10 March 2016
- -Issues and workarounds when using Metalsmith.
- -2 March 2016
- -Do you need Gulp? Can it be integrated with Metalsmith?
- -1 March 2016
- -This article will be published after 1 March, 2016.
- -A selection of articles is available in this section.
- - - -14 March 2016
- -What type of project could benefit from Metalsmith?
- -10 March 2016
- -Issues and workarounds when using Metalsmith.
- -2 March 2016
- -Do you need Gulp? Can it be integrated with Metalsmith?
- -1 March 2016
- -This article will be published after 1 March, 2016.
- -A selection of articles is available in this section.
- - - -14 March 2016
- -What type of project could benefit from Metalsmith?
- -10 March 2016
- -Issues and workarounds when using Metalsmith.
- -2 March 2016
- -Do you need Gulp? Can it be integrated with Metalsmith?
- -1 March 2016
- -This article will be published after 1 March, 2016.
- -A selection of articles is available in this section.
- - - -14 March 2016
- -What type of project could benefit from Metalsmith?
- -10 March 2016
- -Issues and workarounds when using Metalsmith.
- -2 March 2016
- -Do you need Gulp? Can it be integrated with Metalsmith?
- -1 March 2016
- -This article will be published after 1 March, 2016.
- -This section provides an overview of core code and concepts.
- - -