This repository is an example of how to integrate and use the following projects together:

• Bedrock
• Trellis
• Sage (with Soil)

For more background, see this blog post.

This project is a complete working example that's deployed on a Digital Ocean 512MB droplet.

You can view it at http://roots-example-project.com/.

Make sure all dependencies have been installed before moving on:

• Ansible >= 2.0.0.2
• Virtualbox >= 4.3.10
• Vagrant >= 1.5.4
• vagrant-bindfs >= 0.3.1 (Windows users may skip this)
• vagrant-hostmanager

Here's how this example project was created:

1. Create a new project directory: $ mkdir example.com && cd example.com
2. Clone Trellis: $ git clone --depth=1 git@github.com:roots/trellis.git && rm -rf trellis/.git
3. Clone Bedrock: $ git clone --depth=1 git@github.com:roots/bedrock.git site && rm -rf site/.git
4. Clone Sage: $ git clone --depth=1 git@github.com:roots/sage.git site/web/app/themes/sage && rm -rf site/web/app/themes/sage/.git

example.com/      # → Root folder for the project
├── trellis/      # → System management & deployment
└── site/         # → A Bedrock-based WordPress site
    └── web/
        ├── app/  # → WordPress content directory (themes, plugins, etc.)
        └── wp/   # → WordPress core (don't touch!)

1. Clone this repository into a working directory (e.g., ~/Sites)

$ git clone git@github.com:roots/roots-example-project.com.git

2. Install external Ansible roles/packages

# @ roots-example-project.com/trellis
$ ansible-galaxy install -r requirements.yml

3. Install theme components

# @ roots-example-project.com/site/web/app/themes/sage
$ npm install
$ bower install
$ gulp

4. Fire up the server (be patient, but watch the console––it may prompt for your system password)

# @ roots-example-project.com/trellis
$ vagrant up

Note: to shut down the server: vagrant halt

5. Test the install at roots-example-project.dev

# @ roots-example-project.com/trellis
$ ansible-playbook server.yml -e env=<environment>

# @ roots-example-project.com/trellis
./deploy.sh <environment> roots-example-project.com

# OR
ansible-playbook deploy.yml -e "site=roots-example-project.com env=<environment>"

To rollback a deploy:

ansible-playbook rollback.yml -e "site=roots-example-project.com env=<environment>"

In development, run gulp in watch mode for live updates at localhost:3000. Important: always use the roots-example-project.dev URL to access the WordPress admin.

# @ roots-example-project.com/site/web/app/themes/sage
$ gulp watch

Production assets (minified CSS, JavaScript, images, fonts, etc.) need to be compiled. Run gulp with the --production flag. The resulting files will be saved in themes/sage/dist/. Never edit files in the dist directory.

# @ roots-example-project.com/site/web/app/themes/sage
$ gulp --production