Sage is a WordPress starter theme based on HTML5 Boilerplate, gulp, Bower, and Bootstrap, that will help you make better themes.
- Source: https://github.com/roots/sage
- Homepage: https://roots.io/sage/
- Documentation: https://roots.io/sage/docs/
- Twitter: @rootswp, @retlehs, @swalkinshaw, @Foxaii, @c2foryou, @austinpray
- Newsletter: Subscribe
- Forum: https://discourse.roots.io/
|Prerequisite||How to check||How to install|
|PHP >= 5.4.x||
|gulp >= 3.8.10||
|Bower >= 1.3.12||
For more installation notes, refer to the Install gulp and Bower section in this document.
- BrowserSync for keeping multiple browsers and devices synchronized while testing, along with injecting updated CSS and JS into your browser while you're developing
- Bower for front-end package management
- asset-builder for the JSON file based asset pipeline
- Theme wrapper
- HTML5 Boilerplate
- ARIA roles and microformats
- Cleaner HTML output of navigation menus
- Posts use the hNews microformat
- Multilingual ready and over 30 available community translations
Install the Soil plugin to enable additional features:
- Cleaner output of
wp_headand enqueued assets
- Root relative URLs
- Nice search (
Clone the git repo -
git clone https://github.com/roots/sage.git and then rename the directory to the name of your theme or website.
If you don't use Bedrock, you'll need to add the following to your
wp-config.php on your development installation:
lib/config.php to enable or disable theme features and to define a Google Analytics ID.
lib/init.php to setup navigation menus, post thumbnail sizes, post formats, and sidebars.
Install gulp and Bower
Building the theme requires node.js. We recommend you update to the latest version of npm:
npm install -g npm@latest.
From the command line:
- Install gulp and Bower globally with
npm install -g gulp bower
- Navigate to the theme directory, then run
You now have all the necessary dependencies to run the build process.
Available gulp commands
gulp— Compile and optimize the files in your assets directory
gulp watch— Compile assets when file changes are made
gulp --production— Compile assets for production (no source maps).
To use BrowserSync during
gulp watch you need update
devUrl at the bottom of
assets/manifest.json to reflect your local development hostname.
Sage documentation is available at https://roots.io/sage/docs/.
Contributions are welcome from everyone. We have contributing guidelines to help you get started.
Keep track of development and community news.