Add HTML to modules folder and parse module html

This adds better docs to the static page builder and
therefore targets (#118).

It’s part of #123 (v2.0) though and closes #129 when
merged.

Author: anselmh

CHANGELOG.md

@@ -1,11 +1,11 @@
 # Changelog
 
 ### HEAD
+* Add HTML to modules folder and parse module html (#129)
 * Update npm dependencies to latest versions
 * Include better tracking via Google Analytics in a separate file
 * Fetch the `.htaccess` file via `npm`
 * Add a modules folder for all components on a page
-
 * Re-add .htaccess: server-configs-apache in version 2.11.0
 * Remove conditional comments for old IE
 * Drop IE8 support: update jQuery to v2.1.1

docs/TOC.md

@@ -9,6 +9,7 @@
 
 * [Toolchain](toolchain.md) — The tools we use: GruntJS, RequireJS and more.
 * [HTML5 Boilerplate](html5-boilerplate.md) — More about the famous front-end template.
+* [HTML Pages](pages.md) – How to build your HTML markup with INIT.
 * [CSS](css.md) — How to use CSS in INIT.
 * [JavaScript](js.md) — A guide to the default JavaScript with RequireJS.
 * [Build process](grunt.md) - A detailed guide to the GruntJS configs.

docs/html.md

@@ -4,7 +4,7 @@
 
 The HTML structure is mainly based on the famous [HTML5 Boilerplate](http://html5boilerplate.com/). While we use this as a base for our markup we add several things including a default markup for your page layout. This is very simple and it is strongly recommended to adapt this markup to your fits.
 
-## Legazy Internet Explorer
+## Legacy Internet Explorer
 
 To inform users of older Internet Explorers for which the project has not been optimized anymore we provide a Conditional Comment (by default targeting users of IE8 and lower) with a nice little toolbar appearing on top of your website. You are free to adapt this element via changing the text in the markup or adjusting the style via the [`.browsehappy` CSS class](../src/css/layout/base.css#L:85).
 

docs/pages.md

@@ -0,0 +1,19 @@
+[« back to Table of Contents](TOC.md)
+
+# Build HTML pages with INIT
+
+We use [the concat task](concat.md) to stack pages together. In the `src`
+folder we have the `templates` and the `modules` folder which can contain
+markup that you want to use for a page.
+
+The `template` folder usually contains the frame of the page which stacks
+modules together. All modular code (i.e. a navigation, footer, sidebar or
+teaser) should be in the `modules`' own folder as HTML partial.
+
+To build a proper structure you need to configure your page file (usually
+known) as ‘template’. In INIT this configuration is done in the
+[`pages.json`](../pages.json) file. Add the partials you want to use in the
+proper order and comma-separated into the `src` array.
+
+For multiple pages extend the JSON by adding another object (which means page)
+to it.

pages.json

@@ -3,6 +3,7 @@
     "src": [
       "src/templates/header.html",
       "src/templates/index.html",
+      "src/modules/module/module.html",
       "src/templates/footer.html"
     ],
     "dest": "temp/index.html"

src/modules/module/module.html

@@ -0,0 +1 @@
+<!-- Place the markup of your module here -->