HTMG is a lightweight static site generator built with Node.js that supports both HTML and Markdown files. It's designed to be a simple, zero-configuration solution for creating static websites.
- Simple and easy to use
- Zero configuration needed
- Support for HTML and Markdown files
- Built-in layouts and partials system
- SEO meta tags generation
- Asset minification
- Sitemap generation
- Customizable directory structure
Make sure you have Node.js installed, then run:
npx htmg init
This will generate a basic template structure. To start developing your site:
npm run dev
your-project/
├── pages/
├── layouts/
├── public/
└── dist/
HTMG can be customized using a .env
file in your project root. While the default configuration works out of the box, you can customize the directory structure and site settings:
# Directory Configuration
OUTPUT_DIR=dist # Output directory for built files
PAGES_DIR=pages # Source directory for your content
LAYOUTS_DIR=layouts # Directory containing your layouts
PUBLIC_DIR=public # Directory for public assets
# Site Configuration
SITE_URL=https://example.com # Your website URL for SEO.
Contains HTML layouts and their partials. Each layout should be in its own directory.
Example structure:
layouts/
└── default/
├── index.html
├── head.html
└── footer.html
Example usage in index.html
:
<!-- include: head -->
<body>
<!-- page_content -->
</body>
<!-- include: footer -->
Contains all static files used in your website:
- JavaScript files
- CSS stylesheets
- Images
- Other static resources
Contains your website content in either HTML or Markdown format. The content will be injected into the specified layout at the <!-- page_content -->
placeholder.
Pages can include headers to specify metadata:
<!--
layout: default
title: What is Markdown?
meta-description: In this article you will know more about Markdown.
meta-locale: auto-generated
meta-type: article
meta-title: Know more about MD!
meta-name: My site name
-->
Available metadata options:
layout
: Specifies which layout to usetitle
: Page titlemeta-description
: SEO descriptionmeta-locale
: Language/locale informationmeta-type
: Content typemeta-title
: SEO titlemeta-url
: Page URL (can be auto-generated)meta-name
: Site name
To build your site for production:
npm run build
The build process:
- Generates the static site in the
/dist
directory (or custom OUTPUT_DIR) - Maintains the same folder structure as defined in
/pages
- Minifies all public assets: HTML, CSS and JS files
- Generates SEO meta tags based on page metadata
- Creates a sitemap for better search engine indexing
Contributions are welcome! Feel free to submit issues and pull requests.
This project is open source and available under the MIT License.