susi
v0.1.4
Published
Super Simple Site generator.
Downloads
19
Maintainers
avgpReadme
SuSi2
Because static site generation shouldn't be rocket science.
This is the Super Simple Site generator.
You give it markdown files and (if you fancy) an HTML layout to render them into - and it gives you static HTML.
That's it. No magic, no fancy build tools - Markdown and HTML. Now go and make that website!
How to use it
To setup, you run
npm install -g susiand then to parse markdown files into HTML you can use for example:
susi /var/www/markdown /var/www/htmlUsing a layout
Now parsing naked Markdown files into naked HTML often isn't enough, so there's the layout option.
A basic layout
Say you have a layout with a few navigation links and some css like this:
<!doctype html>
<html>
<head>
<link rel="stylesheet" href="style.css">
<title>My Site</title>
</head>
<body>
<nav>
<ul>
<li><a href='home.html'>Home</a></li>
<li><a href='projects.html'>Projects</a></li>
<li><a href='contact.html'>Contact</a></li>
</nav>
<section id="main">{{CONTENT}}</section>
</body>
</html>When you pass in the path to this file as the third parameter, SuSi will render each markdown file into the place of {{CONTENT}}.
So if you do:
susi input/ output/ path/to/layout.htmlA markdown file like this:
# Home
Some *text*will be rendered into:
<!doctype html>
<html>
<head>
<link rel="stylesheet" href="style.css">
<title>My Site</title>
</head>
<body>
<nav>
<ul>
<li><a href='home.html'>Home</a></li>
<li><a href='projects.html'>Projects</a></li>
<li><a href='contact.html'>Contact</a></li>
</nav>
<section id="main">
<h1>Home</h1>
<p>Some <em>text</em></p>
</section>
</body>
</html>which is pretty handy.
Using titles
There is also a second placeholder, {{TITLE}} which can be used to adjust the title for pages individually.
Here is an example:
<!doctype html>
<html>
<head>
<link rel="stylesheet" href="style.css">
<title>My Site {{TITLE}}</title>
</head>
<body>
<nav>
<ul>
<li><a href='home.html'>Home</a></li>
<li><a href='projects.html'>Projects</a></li>
<li><a href='contact.html'>Contact</a></li>
</nav>
<section id="main">
<h1>Home</h1>
<p>Some <em>text</em></p>
</section>
</body>
</html>in combination with
<!-- - Home -->
# Home
Some *text*will turn the title into My Site - Title.
Note: The comment must be the first thing on the first line of your markdown file or title injection will not work.
Now, seriously, go make static websites!