Inclusive Learning Design Handbook

This project contains the content needed to build and deploy a copy of the Inclusive Learning Design Handbook.

Usage

To run locally in development mode

1. Install the required NPM packages: npm install
2. Run Eleventy in development mode: npm start.

The website will be available at http://localhost:8080.

To build and serve using Docker

You can build and serve the website from a Docker container.

Once you have Docker installed, run the following commands to build a Docker image and start a container:

• Build the image: docker build -t ildh .
• Run the container: docker run --name ildh -p 8000:80 ildh

The website will be available at http://localhost:8000

If you make changes to the website, repeat the steps to build the image and start a new container.

To build for deployment to a personal web server

1. Install the required NPM packages: npm install
2. Run the build script: npm run build
3. Upload the contents of the ./_site/ directory to the web root of your server.

If you make changes to the website, repeat step 2 to build the website and upload any changed files from the ./_site/ directory to the web root of your server.

Notes

Modifications can be made to any source file or directory except for the contents of the ./_site/ directory. The ./_site/ directory is not versioned since it contains the built website that Eleventy generates from the source files, and files in _site are overwritten at build time.

Trivet

The ILDH website is based on Trivet, an Eleventy website starter kit.

For more information about making asset pipeline changes, please see the Asset Handling documentation.

Previous version of the ILDH

An older version of the ILDH website used from 2011 to 2015 was previously hosted at the same repository name. It has been archived and can be found here: https://github.com/fluid-project/2015-handbook.floeproject.org

Working with Decap CMS

Trivet includes configuration for administering site content via Decap CMS. This has not been included in the ILDH, though it can be re-enabled by copying the relevant lines and files from Trivet. In particular, the directory src/admin must be copied into the project and subsequently included in the _site directory upon building the project.

After enabling admin functionality, the Decap CMS configuration can be edited in src/admin/config.yml. For full documentation, see the Decap CMS documentation.

Internationalization

The ILDH includes internationalization support. To add a language, the following changes need to be made:

1. Update the supportedLanguage object of fluid plugin in eleventy.config.js to add the new language. For example, to add Farsi, you would use the IETF language code as the key, and add the following object values:

   • a short form of the language code for use in permalinks
   • a short form of the language code that corresponds to an available message bundle locale for Infusion's User Interface Options
   • the direction (ltr for left to right or rtl for right to left)
   • the localized language name (endonym)

   {
      "supportedLanguages" : {
            "fr-CA": {
                "slug": "fr",
                "name": "Français",
                "dir": "ltr",
                "uioSlug": "fr"
            }
        }
   }

   You can set the site's default language by changing the defaultLanguage value in fluid plugin object in eleventy.config.js to the IETF language code of the desired default language.

2. Add folders in each collection for translated content. For example, you would add a folder called fa-IR to src/collections/pages.

For more information about how Netlify CMS works with internationalized content, see the internationalization support documentation.

License

The Inclusive Learning Design Handbook's code is available under the 3-Clause BSD License.

The Inclusive Learning Design Handbook's content is licensed under the Creative Commons Attribution 4.0 license.

Third Party Software in ILDH

The ILDH is based on other publicly available software, categorized by license:

MIT License

• Eleventastic
• eleventy-webpack
• Hylia
• Supermaya
• Vanilla JS Toolkit - nextUntil.js