Local Environment

The easiest way to set up the site for local development on your local machine is using MAMP (or WAMP if you're on a Windows machine). The rest of this setup guide will assume you're using a Mac and using MAMP. If either of those statements are not true in your case, you won't be able to use this setup guide.

Note

We're only setting up a single site in this case, not multi-site as is the case for bridgeschool.org. If you want to work on multiple sites (e.g. the main site and one of the subdomain sites), the best option would be to set up multiple sites in MAMP once MAMP is up and running. If you create a subdomain site, you can follow the rest of the site setup docs below, just replace references to bs-www with the name of your subdomain. However, there are currently no Database or Images seed files for subdomains, so you're on your own there.

Install Homebrew

Before you continue, make sure you have Homebrew installed (OSX). See the Software page.

Install MAMP

MAMP is a (M)ac, (A)pache, (M)ySQL, (P)hp server. Once it's installed you can open the MAMP application to manage your PHP sites.

Install it using the following Homebrew command in terminal:

brew install --cask mamp

Verify success by trying to launch the MAMP app on your laptop.

Install WP-CLI

The Wordpress CLI allows you to handle lots of the setup and management of a Wordpress installation through command line (or through scripting). Install the WP-CLI with the following Homebrew command in terminal:

brew install wp-cli

Verify installation by running the following command (you may need to close and re-open terminal)

wp --info

Note

For all steps that follow, MAMP needs to be running. Launch the MAMP application and then hit the "Start" button

Create a folder for the site

The first step to creating your site in MAMP is to create the site folder. Depending on which site you're tring to set up, use the name in the MAMP folder column from the table. The table also includes links to the SQL file and uploads file that you will need later to seed the site with data.

Note

The table only contains two sites: bs-www is the main Bridge School site; bs-cvi is a the CVI site, but can be used to test code for any subdomain.

Site	MAMP Folder	SQL File	Upload File
Bridge School	`bs-www`	bs-www.sql.zip	bs-www-uploads.zip
CVI	`bs-cvi`	bs-cvi.sql.zip	bs-cvi-uploads.zip

Warning

The Bridge School custom Wordpress theme is very opinionated when it comes to site names and identifiers (both in production and local dev). This means that in order for all things to function properly, the site subdomains (for bridgeschool.org and bridgeschool2.org) and the names of the MAMP folders (for local dev), must reflect the values in the code.

For the remainder of this guide, we'll be setting up the main site (bs-www). If you want to set up a different site, just replace bs-www with the proper value for all commands that follow.

Once you have found the proper name for your MAMP folder, open the MAMP application and determine the root folder for your MAMP installation. Usually, this will be /Applications/MAMP/htdocs. Once you have located the root MAMP folder, create the site folder in the root of the MAMP install via Finder or by running the following command in terminal:

mkdir /Applications/MAMP/htdocs/bs-www

Install and set up Wordpress

Once the folder is created, navigate to the folder in terminal:

cd /Applications/MAMP/htdocs/bs-www

Note

All the rest of the wp-cli commands in this guide (i.e. any command that starts with wp) need to be executed from the bs-www directory to ensure that wp-cli knows which site you're interacting with.

Download Wordpress

From within the bs-www directory, set up the site using the following commands:

wp core download --path=./

Configure Wordpress

wp config create \
    --dbname=bs-www \
    --dbuser=root \
    --dbpass=root \
    --dbhost=localhost:8889 \
    --force

The above command will create a wp-config.php file in your MAMP site (/Applications/MAMP/htdocs/bs-www assuming you've followed the above instructions). However, in order for things to render properly and behave correctly locally while using MAMP, you will need to define an extra constant in the wp-config.php file. Add the constant using the following command:

wp config set MAMP_SITE 'bs-www' \
    --placement=before \
    --separator='\n\n'

Create the Database

Use the wp-cli to create the database:

wp db create

Install Wordpress

Use the wp-cli to install Wordpress:

wp core install \
    --url=http://localhost:8888/bs-www \
    --title="Bridge School" \
    --admin_user=admin \
    --admin_password=admin \
    --skip-email \
    --prompt=admin_email

When prompted in terminal, supply your email. It won't actually send you a confirmation, but it needs an email address in order to install.

Import the database

If you haven't already, download the appropriate database file from above.

Once you have the file, move it into your MAMP site folder (/Applications/MAMP/htdocs/bs-www) and import the data using wp-cli:

wp db import bs-www.sql

Import images and files

If you haven't already, download the appopriate Uploads Zip folder from above.

Unzip the file and move the contents of the uploads folder to the uploads folder of your site in MAMP (/Applications/MAMP/htdocs/bs-www/wp-content/uploads).

Update permalink structure

In order to utilize the rewrite commands of wp-cli you need to add in the Apache rewrite module in your config file (by default located at ~/.wp-cli/config.yml). Open/create the file and add the following lines (make sure you include the indentation of the second line):

apache_modules:
  - mod_rewrite

OR

run the following command in terminal:

cat <<EOT >> ~/.wp-cli/config.yml
apache_modules:
  - mod_rewrite
EOT

Once the lines have been added to the config file, update the permalink structure with the following command:

wp rewrite structure /%postname%/ --hard

Install plugins

At the bare minimum, you'll want to install the Custom Field Suite (custom-field-suite) plugin with the command below:

wp plugin install custom-field-suite --activate

You can install any additional free plugins with this command by replacing custom-field-suite with the slug of the plugin you want to install.

Note

Purchased plugins like Gravity Forms will have to be downloaded and installed manually.

Install theme via symlink

First clone the Bridge School Wordpress theme from Bitbucket and make note of the path to the repository on your local machine. (~/dev/bs-wptheme-www in the example below).

git clone git@bitbucket.org:bridgeschool/bs-wptheme-www.git ~/dev/bs-wptheme-www

Once the repository is cloned, create a symbolic link for the theme into the themes directory of your Wordpress install:

ln -s ~/dev/bs-wptheme-www /Applications/MAMP/htdocs/bs-www/wp-content/themes/bs-wptheme-www

After creating the link, the Bridge School theme should show up in the admin panel of your Wordpress installation for use.

Activate theme

If you want to activate the theme right away, you can do it with wp-cli:

wp theme activate bs-wptheme-www

Note

You can always activate or change themes manually in the Wordpress admin panel too, as long as you've properly linked in the repository as instructed above.

Verify Wordpress

At this point, you should be able to visit the Wordpress site running in MAMP by going to

http://localhost:8888/bs-www.

You can login to the admin panel at

http://localhost:8888/bs-www/wp-admin.

Note

Assuming you followed this guide, the credentials to login to the dashboard will be (username: admin; password: admin)