Deploying Bedrock WordPress website to Combell using AutoGit

Bedrock creates a project structure which is way more maintainable than a normal WordPress install. It is easy to check in to version control and we can manage our dependencies with Composer.

In this post, I will be describing how to automatically deploy your Bedrock installation from your local development environment to Combell using AutoGit.

The Roots stack

The Roots stack consists of 3 tools for developing WordPress websites

• Sage: WordPress starter theme
• Bedrock: WordPress boilerplate
• Trellis: Tool for managing WordPress environments

My projects only implement Sage & Bedrock because as far as I know, Trellis only supports NGINX, and Combell runs Apache.

1. Setting up your local environment

I will be using Local by Flywheel as my local development environment. Websites are easy to set up. You can hot-swap PHP versions with the simple click of a button. Mailhog is built-in and makes sure no e-mails are being sent to real people, while still enabling you to debug them, …

1.1. New website

Create a new website in Local. To match Combell’s web server, select Apache in the setup wizard. At the time of writing, I prefer PHP 7.3.5 to PHP 7.4.1 (because it is currently missing the zlib extension).

By default, your WordPress installation will be located in path-to-local/site-name/app/public. We won’t be using this directory and its files, so you can go ahead and delete it. If you visit your website now, it will obviously be broken. We will be updating the DocumentRoot in a later step (1.3). Make sure the path-to-local/site-name/app/ directory is empty.

1.2. Install bedrock

Run composer create-project roots/bedrock . in the path-to-local/site-name/app/ directory. This will create the Bedrock project structure.

1.3. www directory as DocumentRoot

Combell requires the DocumentRoot to be a directory named ‘www’, while Bedrock servers files from the ‘web’ directory. This Combell AutoGit Symfony example shows how to symlink the www directory to the web directory, but we will take another approach. This will keep our repository cleaner.

1. Rename path-to-local/site-name/app/web to path-to-local/site-name/app/www
2. Change DocumentRoot in path-to-local/site-name/conf/apache/site.conf.bs: replace all instances of {{root}} by the full path to the www directory e.g. /Users/tombroucke/Local Sites/site-name/app/www
3. Replace web by www in path-to-local/site-name/app/wp-cli.yml, so you can use wp cli from the root directory
4. Replace web by www in path-to-local/site-name/app/composer.json, so composer knows where to install dependencies
5. Replace /web by /www in path-to-local/site-name/app/config/application.php

After this step, your local website should be back up, showing a database connection error. We need to configure Bedrock. Edit the .env file:

1. DB_NAME='local'
2. DB_USER='root'
3. DB_PASSWORD='root'
4. WP_HOME='https://site-name.local'
5. Generate & replace salts

When you visit https://site-name.local, the page should be blank. The reason for this white screen of death, is that there are no themes installed by default. You can however, visit https://site-name.local/wp/wp-login.php, and log in to the WordPress admin area.

Now may be a good time to install a theme, or even better, start one from scratch using composer create-project roots/sage your-theme. But that is outside the scope of this post.

2. Git configuration

The main part of this chapter is described in the AutoGit reference, but I will summarize the main points.

2.1. Enable AutoGit

Enable AutoGit in your Combell control panel. This will re-arrange the directory structure on the target server. This will also initialize a bare git repository on your server.

2.2. git init

Now is the time to initialize a new git repository in our local environment. (inside path-to-local/site-name/app/). The project’s origin will be on Github, we will only be using the Combell repository to deploy through ‘git push’.

1. cd path-to-local/site-name/app/
2. git init
3. git remote add origin https://github.com/user/repo.git
4. git remote add combell [email protected]:auto.git
5. git add .
6. git commit -am "Initial commit"

3. Autogit.yml

When you activate Autogit, a sample .autogit.yml will be generated on the target server. Copy the file to path-to-local/site-name/app/.autogit.yml & add it to your git repository.

1. scp [email protected]:autogit.yml.example .autogit.yml
2. git add .autogit.yml
3. git commit -am "Add the default .autogit.yml template"

3.1. Shared files & folders

Depending on your project, some files and directories need to be ‘shared’. Add all files and directories which contain assets or configuration files that are inherent to different environments.

shared_files:
  - .env
  - www/.htaccess
  - www/.htpasswd
  - www/app/debug.log
  - www/app/advanced-cache.php
  - www/app/wp-cache-config.php

shared_folders:
  - www/app/backup-db
  - www/app/backups
  - www/app/blogs.dir
  - www/app/cache
  - www/app/upgrade
  - www/app/uploads
  - www/app/wflogs
  - www/app/wp-rocket-config
  - www/wp-content/languages/wpml

3.2. Hooks

3.2.1. install_before

I prefer to build my Sage theme locally, and commit the theme/dist folder to the git repository. Building the theme during deploy (yarn && yarn build:production) takes a lot of time and could be prone to failing. If you prefer to build your theme during the deployment proces, the install_after hook would be a good place to build your theme.

To make sure my website doesn’t break, I need to make sure whether the theme has been build, if not, I want the deployment proces to stop.

if [ ! -d "www/app/themes/my-theme/dist" ]
then
	echo "Error: Build your theme folder before pushing to Combell: yarn --cwd www/app/themes/my-theme build:production"
	exit 1
fi
exit 0

3.2.2. sharedsymlink_after

When all code has been copied and our environment variables are present, we need to install our dependencies:

composer install --no-dev --classmap-authoritative --prefer-dist
composer install --no-dev --classmap-authoritative --prefer-dist -d www/app/themes/my-theme/
exit 0

3.2.3. symlink_after

When this hook fires, all code has been deployed, dependencies have been installed and this latest release is symlinked to the current folder.

I use WP Rocket to speed up my websites. I want the cache to be cleared after each deploy. (To be able to run this commands, you need to have the WP Rocket CLI interface installed)

wp rocket regenerate --file=advanced-cache --path="www/wp"
wp rocket clean --confirm --path="www/wp"
wp rocket preload --path="www/wp"
exit 0

The advanced-cache file needs to be regenerated because the full path to the WordPress installed has been changed (e.g. site-name.com/checkout/master/ba69897483886f0d2b0afb6345b76c0c/www)

4. Deploy

That should be it. Deploying your website is as easy as running git push combell master. This command will deploy your master branch to your main website. If you added a subsite e.g. staging.site-name.com in your Combell Control Panel, you can add a branch called ‘staging’. Running git push combell staging will deploy your website to your staging.