/coenv-fishfh

Simple header and footer theme for AFS

Primary LanguageJavaScript

FoundationPress

This is a WordPress starter theme based on Foundation 5 by Zurb. The purpose of FoundationPress, is to act as a small and handy toolbox that contains the essentials needed to build any design. FoundationPress is meant to be a starting point, not the final product. If you're looking for an all-in-one theme with built-in shortcodes, plugins, fancypancy portfolio templates or whatnot, I'm afraid you have to look elsewhere.

Please fork, copy, modify, delete, share or do whatever you like with this.

All contributions are welcome!

Requirements

You'll need to have the following items installed before continuing.

  • Node.js: Use the installer provided on the NodeJS website.
  • Grunt: Run [sudo] npm install -g grunt-cli
  • Bower: Run [sudo] npm install -g bower

Quickstart

cd my-wordpress-folder/wp-content/themes/
git clone
mv coenv-fishfh your-theme-name
cd your-theme-name
npm install && bower install

While you're working on your project, run:

grunt

Grunt will recomplie and minifiy your sass files into a single stylesheet

And you're set!

Stylesheet Folder Structure

  • style.css: Do not worry about this file. (For some reason) it's required by WordPress. All styling are handled in the Sass files described below

  • scss/app.scss: Sass imports for global config, foundation and site structure

  • scss/config/_variables.scss: Your custom variables

  • scss/config/_colors.scss: Your custom color scheme

  • scss/config/_settings.scss: Original Foundation 5 base settings

  • scss/site/_structure: Your custom site structure

  • css/app.css: All Sass files are minified and compiled to this file

Script Folder Strucutre

  • bower_components/: This is the source folder where all Foundation scripts are located.
  • js/: jQuery, Modernizr and Foundation scripts are copied from bower_components/ to this directory, where they are minified and concatinated and enqueued in WordPress
  • Please note that you must run grunt in your terminal for the scripts to be copied. See Gruntfile.js for details