Skip to content

Commit

Permalink
update README for Hadron
Browse files Browse the repository at this point in the history
  • Loading branch information
Colin Johnston committed Mar 27, 2016
1 parent f48d220 commit f95319b
Showing 1 changed file with 59 additions and 34 deletions.
93 changes: 59 additions & 34 deletions README.md
Original file line number Diff line number Diff line change
@@ -1,17 +1,10 @@
# WIP - this is just a fork of existing Sage so far.
---
# [Sage](https://roots.io/sage/)
[![Build Status](https://travis-ci.org/roots/sage.svg)](https://travis-ci.org/roots/sage)
[![devDependency Status](https://david-dm.org/roots/sage/dev-status.svg)](https://david-dm.org/roots/sage#info=devDependencies)
# [Hadron](https://github.com/electronspin/hadron)

Sage is a WordPress starter theme based on HTML5 Boilerplate, gulp, Bower, and Bootstrap Sass, that will help you make better themes.
**Hadron is a WordPress starter theme built upon Sage, using Foundation for Sites 6.2.**

* Source: [https://github.com/roots/sage](https://github.com/roots/sage)
* Homepage: [https://roots.io/sage/](https://roots.io/sage/)
* Documentation: [https://roots.io/sage/docs/](https://roots.io/sage/docs/)
* Twitter: [@rootswp](https://twitter.com/rootswp)
* Newsletter: [Subscribe](http://roots.io/subscribe/)
* Forum: [https://discourse.roots.io/](https://discourse.roots.io/)
[**Sage**](https://roots.io/sage/) is a WordPress starter theme based on HTML5 Boilerplate, gulp, Bower (and Bootstrap Sass, originally) that will help you make better themes. Sage is produced and maintained by Ben Word and the team at [Roots](https://roots.io).

[**Foundation for Sites**](http://foundation.zurb.com/sites.html) is a front-end framework for rapidly building content-focused websites. It includes a wide range of modular and flexible components that are easily styled. Foundation for Sites is produced and maintained by the team at [ZURB](http://www.zurb.com/)

## Requirements

Expand All @@ -24,19 +17,19 @@ Sage is a WordPress starter theme based on HTML5 Boilerplate, gulp, Bower, and B

For more installation notes, refer to the [Install gulp and Bower](#install-gulp-and-bower) section in this document.

## Features
## Sage Features

* [gulp](http://gulpjs.com/) build script that compiles both Sass and Less, checks for JavaScript errors, optimizes images, and concatenates and minifies files
* [BrowserSync](http://www.browsersync.io/) for keeping multiple browsers and devices synchronized while testing, along with injecting updated CSS and JS into your browser while you're developing
* [Bower](http://bower.io/) for front-end package management
* [asset-builder](https://github.com/austinpray/asset-builder) for the JSON file based asset pipeline
* [Bootstrap](http://getbootstrap.com/)
* [Theme wrapper](https://roots.io/sage/docs/theme-wrapper/)
* [Foundation for Sites](http://foundation.zurb.com/sites.html) 6.2 (now with [Babel](https://babeljs.io/) integration)
* Sage [Theme wrapper](https://roots.io/sage/docs/theme-wrapper/)
* ARIA roles and microformats
* Posts use the [hNews](http://microformats.org/wiki/hnews) microformat
* [Multilingual ready](https://roots.io/wpml/) and over 30 available [community translations](https://github.com/roots/sage-translations)

Install the [Soil](https://github.com/roots/soil) plugin to enable additional features:
Install Roots' [Soil](https://github.com/roots/soil) plugin to enable additional features:

* Cleaner output of `wp_head` and enqueued assets
* Cleaner HTML output of navigation menus
Expand All @@ -45,31 +38,34 @@ Install the [Soil](https://github.com/roots/soil) plugin to enable additional fe
* Google CDN jQuery snippet from [HTML5 Boilerplate](http://html5boilerplate.com/)
* Google Analytics snippet from [HTML5 Boilerplate](http://html5boilerplate.com/)

See a complete working example in the [roots-example-project.com repo](https://github.com/roots/roots-example-project.com).

## Theme installation

Bottom line is you want to get the files in this repo into your local development environment. There are many ways to do this, two of which we will cover here.
How to get the files in this repo into your local development environment:

### via Command-line

If you're already [using Composer to manage WordPress](https://roots.io/using-composer-with-wordpress/), then you might consider using composer's `create-project` command to download Sage.
To pull the latest version of Hadron into your working theme directory:

*Note: it is recommended to complete the [theme setup](#theme-setup) and initial steps of [theme development](#theme-development) before activating Hadron in your WordPress installation.*


The example below assumes you're using Bedrock. If you're not, simply change the target path accordingly.

```sh
composer create-project roots/sage web/app/themes/your-theme-name-here
cd your-project/wp-content/themes
git clone https://github.com/electronspin/hadron.git your-theme-name && cd your-theme-name

```

Then activate the theme via [wp-cli](http://wp-cli.org/commands/theme/activate/).

```sh
wp theme activate your-theme-name-here
wp theme activate your-theme-name
```

### via WordPress Admin Panel

1. [Download the latest release](https://github.com/roots/sage/releases/latest) of Sage.
1. [Download the latest release](https://github.com/electronspin/hadron/releases/latest) of Hadron.
2. In your WordPress admin panel, navigate to Appearance->Themes
3. Click Add New
4. Click Upload Theme
Expand All @@ -90,17 +86,33 @@ Building the theme requires [node.js](http://nodejs.org/download/). We recommend
From the command line:

1. Install [gulp](http://gulpjs.com) and [Bower](http://bower.io/) globally with `npm install -g gulp bower`
2. Navigate to the theme directory, then run `npm install`
3. Run `bower install`

### Install dependencies

Also from the command line:

Navigate to the theme directory, then run

1. `npm install`

1. `bower install`

You now have all the necessary dependencies to run the build process.

### Available gulp commands
### Using gulp

Once you've installed NPM and Bower dependencies---but before you activate the theme---you need to compile the assets:

From your theme directory, run `gulp`

#### 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).

For more info about gulp, and to learn how to customize your builds, go to [gulp.js](http://gulpjs.com/)

### Using BrowserSync

To use BrowserSync during `gulp watch` you need to update `devUrl` at the bottom of `assets/manifest.json` to reflect your local development hostname.
Expand All @@ -122,19 +134,32 @@ If your local development URL looks like `http://localhost:8888/project-name/` y
...
```

For more info about BrowserSync, go to [browsersync.io](https://www.browsersync.io/)
### Local development using Wocker

I really like using Wocker for quick POCs and experiments.

Wocker is a Docker-based rapid development environment of WordPress that runs inside a Vagrant box.

See the [Getting Started](http://wckr.github.io/#h2-1) guide to get up and running.

## Documentation

Sage documentation is available at [https://roots.io/sage/docs/](https://roots.io/sage/docs/).
This README (which is a variation of the original [Sage README](SAGE_README.md)) is the extent of documentation needed to get up and runnning.

**Sage** documentation is available at [https://roots.io/sage/docs/](https://roots.io/sage/docs/).

**Foundation for Sites** documentation is available at [http://foundation.zurb.com/sites/docs/](http://foundation.zurb.com/sites/docs/)

## Contributing

Contributions are welcome from everyone. We have [contributing guidelines](CONTRIBUTING.md) to help you get started.
Contributions to Hadron are welcome from everyone. If you'd like to contribute to Sage or Foundation check out their respective repos.

## Social

This is my first project of this kind, and I'd appreciate any encouragement, suggestions, bug fixes, or general OSS guidance. Reach me [@colinjohnston](https://twitter.com/colinjohnston) or colin [at] electronspin [dot] com


## Community
Thanks to Ben Word ([@retlehs](https://twitter.com/retlehs)) and the team at Roots for creating Sage; I'm learning some good habits reading through your code and working with your tools. And thanks to the folks [@ZURB](https://twitter.com/ZURB) for creating Foundation---although the upgrade path from one major version to the next can be pretty hectic, it really is (in my opinion) the best heavy-duty front-end framework out there.

Keep track of development and community news.

* Participate on the [Roots Discourse](https://discourse.roots.io/)
* Follow [@rootswp on Twitter](https://twitter.com/rootswp)
* Read and subscribe to the [Roots Blog](https://roots.io/blog/)
* Subscribe to the [Roots Newsletter](https://roots.io/subscribe/)

0 comments on commit f95319b

Please sign in to comment.