A killer WordPress theme framework built using underscores, gulp, sass, bourbon, bourbon neat, bower & browsersync. This project is also available as a pre-compiled WordPress starter theme.
A Child Theme starting point of the Forward Framework is available on the child-theme
branch. Make sure to read Setup & Overriding Styles.
Keep Reading!
Clone/Fork/Download this project wherever you like and symlink build/
to wp-content/themes/[example-theme]
.
Note: Values [inside-brackets]
can be changed.
$ git clone [email protected]:drawbackwards/Forward-Framework.git ~/[Sites]/[forward-framework]
$ cd ~/Sites/[example-wordpress-install]/wp-content/themes/
$ ln -s ~/Sites/forward-framework/build [example-theme]
Your themes directory should now look like this:
`- wp-content/
|- plugins/
`- themes/
|- example-theme -> ~/Sites/forward-framework/build
`- twentyfifteen/
- Open
gulpfile.js
and modify theproject
andurl
variables accordingly. - MAMP Users: Enable the port 8888 parameter for BrowserSync (Search for 'Port setting for MAMP users' in
gulpfile.js
).
$ npm install --global gulp
$ cd ~/Sites/forward-framework/
$ npm install
$ npm install -g bower
$ bower install
This will generate the initial theme files in build/
.
$ gulp build
- Activate theme at
[localhost]/wp-admin/themes.php
- Create a new menu at
[localhost]/wp-admin/nav-menus.php
and assign to the Primary Menu Theme location.
Running gulp build
will generate/rebuild the build/
directory without starting a watch process.
$ gulp build
Running gulp
or gulp watch
will start the watch process & browser-sync. Changes to src/
are written to build/
.
$ gulp
Running gulp dist
will generate an optimized, production ready version of the theme based on build/
. This will be the folder you deploy to production.
$ gulp dist
- Licensed under the GPLv3.