Installing Sage Starter Theme in Local by Flywheel
⚠ Heads up! I have rebuilt this theme using Timber/Twig. I haven’t maintained the Sage theme in a few years so this information is very outdated. Please checkout the Sage website for more current instructions.
I decided it was finally time to update/rebuild my portfolio in WordPress and I wanted to challenge my self by using a setup I’ve never used before. I chose to try the Sage starter theme because it is a modern development setup that is pretty different from the way I’ve done things in the past.
Because there are so many excellent articles on the topic that explain the process of setting up Sage better than I could, this post will mostly be an info dump with links to resources and tutorials that I used to set up Bedrock and Sage using Local by Flywheel. Enjoy!
From the installation instructions on Roots.io:
- WordPress >= 4.7 (I used Local by Flywheel for my local WP installation)
- PHP >= 7.1.3
- Composer (I already had composer previously installed globally and ran “composer update” to update to the latest stable version)
- Node.js >= 8.0.0 (Node was already installed, and I updated it with nvm by
finding the stable version of node and running “nvm install XX.XX.X”See notes below before you do this)
- Yarn (I already had this installed and updated by running “brew upgrade yarn”)
- Install or update the above requirements
- Install Bedrock on Local by Flywheel (<project-root>/app/bedrock)
- Install Sage on Local by Flywheel (<project-root>/app/bedrock/web/wp/wp-content/themes)
- Log in to the WordPress admin and switch the theme to your Sage starter theme.
- During the set up, I selected the default Bootstrap for the front-end framework.
- I also set up a github repository in my starter theme directory immediately after successfully installing the theme.
- The first time I ran “yarn start” I got an error message that said “Node Sass does not yet support your current environment: OS X 64-bit with Unsupported runtime (72).” This is because the version of node I had upgraded to was not supported by the node-sass module. To solve this, I had to look up which node version would work with node-sass and run the following in the command line:
- nvm install 10.18.0
- npm rebuild node-sass
- Sage installation instructions from Roots.io
- Installation instructions from Fresh Consulting
- Installation instructions from the Watch and Learn youtube channel “Sage is Awesome” playlist
- Using Local by Flywheel to set up Sage starter theme:
- Instructions for installing bedrock in the app folder from Roots.io documentation.
- This person set up a script that automates a lot of the installation process
- Excellent overview of modern WordPress development using Sage.