All · Bootstrap · Google Analytics · Sage · Uncategorised · Wordpress

Setting up a development environment for Sage Starter WordPress theme.

Setting up a development environment for Sage Starter WordPress theme.

I have been using the roots classing theme and have recently started to use the new Sage version. Here I will explain how I setup my development environment to use node.js with gulp and bower dependencies. I have set this up on both OSX and Windows, hopefully the below will cover both.

I will assume you have already setup a xampp / mampp local server with an installation of wordpress

Some basic commands in dos/terminal will be needed:

Terminal command guide

Basic DOS commands

Required:

PC;

Python 2.7

Microsoft Visual Studio C++ 2013 Express version

OSX;

Python 2.7 (already on OSX)

XCode and Command Line Tools

You will also require Node.js and git

On Windows using Node.js Command Prompt or on OSX using terminal;

Clone the git repo to a folder in your wordpress theme folder

git clone https://github.com/roots/sage.git theme

open wp-config.php and add

define('WP_ENV', 'development');

cd to theme folder and install gulp and bower

npm install -g gulp bower

install node dependencies

npm install

install bower dependencies

bower install

running gulp will compile and optimize the file for the first time

gulp

See the Sage docs for further reading