"Ren" stands for "clean" in Norwegian.
It's no secret that Wordpress adds a lot of extra markup to your theme right out of the gate. Ren is a starter theme that strips just about everything extreneous, including:
- Generator meta tag
- Windows Live Writer manifest link
- RSD link
- JSON REST API link
- Canononical links
- RSS feed links
- Body classes
- Navigation menu classes
- Image widths (editor and featured)
- God-awful Wordpress emojis
- ...and much more
As expected, most of the magic happens in the functions.php file via filters, so enable or disable whatever you need.
The structure is based on the 7-1 pattern with the addition of a folder for browser fixes:
/abstracts/: variables, mixins, extends/base/: base styling for typography, containers, tables, etc./compatibility/: browser specific fixes./components/: buttons, navigation, etc./pages/: page-specific styles./partials/: styles for large page sections...headers, footers, sidebars, etc./themes/: overall theme styles (light theme, dark theme, etc.)./vendor/: external library files, plugin styles, etc.
We're using Thoughtbot's Bourbon, Neat, and Bitters as our framework. These are all much lighter than other frameworks and allow us to organize media queries within our selectors.
Within the /vendor/ folder is a copy of _bourbon.scss and \.neat.scss. These files link to their respective library in whatever package manager you prefer (npm, bower, w/e)...just change the links accordingly. Neat's \_settings.scss is an exception to this, as these should be changed on the fly to accomodate your own grid and container preferences.
- Bourbon
/vendor/_bourbon.scss
- Neat
/vendor/_neat-settings.scss/vendor/_neat.scss
Take note: Neat 2.0 uses calc() to create it's grid elements widths. While calc() has fairly good support (at the time of this writing, caniuse.com has it 94%) you may need to include some kind of polyfill if you're supporting older, legacy browsers like IE8.
Bitters files are contained within the /abstracts/, /base/, and /components/ folder. You can override or overwrite them. Either way, they're a good starting point.
- Bitters
/abstracts/_variables.scss/base/_base.scss/base/_forms.scss/base/_layout.scss/base/_lists.scss/base/_media.scss/base/_tables.scss/base/_typography.scss/components/_buttons.scss
A few themes inspired me to build this:
- HTML5Blank by Todd Motto and Underscores by Automattic: two nice, clean starter Wordpress themes
- Rapid Springs by Paul Stonier: This theme actually moved me to using Bourbon, Neat, and Bitters into my own workflow.
100% free to use and redistribute, and licensed under the MIT license. Any other snippets taken are licensed by their respective creators.