Skip to content
This repository has been archived by the owner on Feb 25, 2018. It is now read-only.

What is MODX Boilerplate?

Jump to bottom
smooth-graphics edited this page Jul 13, 2011 · 3 revisions

What is MODX-Boilerplate?

„MODX Boilerplate“ is a free HTML5-template for rapid website development with the MODX Revolution CMF. It's based on the widely-used HTML5Boilerplate but contains some additional scripts for increased performance as well as some code-snipptes for common usage.

Notice: This template is only a raw HTML/CSS/JS-Framework. There's no layout in it to sustain the flexibility as MODX itself does. This framework is thought to help you creating a technically correct HTML5 website with backwards compatibility for older browsers. It's up to you what layout or techniques you want to use for your website.

What's the content of the MODX-Boilerplate package?

Due to the fact it's been created only for MODX and based on the HTML5Boilerplate, we use their file structures. We created the MODX assets structure for the template and preserved the Boilerplate folder structure inside. This is best practice even for new MODX users who don't know the whole structure. Our package includes the following files:

  • HTML5Boilerplate: Structure (part.), HTML-Code (part.), etc.
  • yepnope.js: Javascript for delayed, asynchronuous loading and execution of JS code.
  • webfontloadenhancer.js: Control over loading of webfonts due to font-smoothing issues.
  • modernizr: HTML5-Modernizr. For adding better HTML5 support to specific webbrowsers
  • jQuery: latest build of jQuery library used min.
  • MODX Chunks + Template: The HTML parts are split into 3 files you should use in MODX Manager (Chunk for header and footer, template with chunk calls for content)
  • 320up: As of v2 the 320up concept has been adopted to the MODX-Boilerplat to serve responsive-mqs
  • CSS files: Some CSS files are served, too. They provide basic settings as a CSS reset. They do not affect layout in a bad way.
  • 1140px Grid system: you can also use another css-file with 1140px grid system integrated. Features media-queries and dynamic layout.
  • 978px Grid system: If you prefer using a fixed grid system please use the 978px system.
  • inuit.css: inuit.css is a ready-to-go style-mix for responsive-layouts.
  • CSS3PIE: this .htc file adds basic CSS3 support in CSS-file for IE<9
  • accessifyhtml5.js: this jQuery based script adds ARIA support to HTML5 markup.
Clone this wiki locally