A base WordPress Theme for creating completely custom themes, built using Underscores (_s) and Foundation 5. Grunt and Bower are used for maintaining components and preparing assets.
PHP CSS JavaScript
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Permalink
Failed to load latest commit information.
assets
inc
parts
.bowerrc
.gitignore
404.php
Gruntfile.js
README.md
archive.php
bower.json
comments.php
content-none.php
content-page.php
content-search.php
content-single.php
content.php
footer.php
functions.php
header.php
index.php
package.json
page-kitchen-sink.php
page.php
screenshot.png
search.php
searchform.php
sidebar.php
single.php
style.css

README.md

WP Foundation Theme

A WordPress Starter Theme for creating completely custom themes, built using Underscores (_s), Foundation 5 and Font Awesome. Grunt and Bower are used for maintaining components and preparing assets.

This theme is aimed at developers and people who want to become more familiar with using tools like SASS and Grunt in their projects.

Screenshot

Example Screenshot

Requirements

Usage

  • First clone the Theme from this repository, setting the folder to something relevant for your new theme. Alternatively, you can download the latest version and unzip it manually.
git clone https://github.com/PeterBooker/wp-foundation-theme.git custom-folder-name
  • Next we will perform several find & replace actions to customise the Theme (ignore double quotes in my examples, use case sensitivity)

    • Find "WP Foundation Theme" replace with "CustomName" (replaces package name)

    • Find "foundation_" replace with "customname_" (replaces function prefixes)

    • Find "'foundation" replace with "'customname" (replaces textdomain and file handles)

    • Find "FOUNDATION_" replace with "CUSTOMNAME_" (replaces constants)

  • Then you need to customise the values inside of the package.json file (you can leave the bottom half under 'devDependencies'). These values are used to build the comments at the top of the style.css file (among other things), which tells WordPress about your theme.

  • Now we need to make sure the relevant dependencies are installed. Navigate to the theme folder in the command line and run:

    npm install -g bower grunt-cli
    bower install
    npm install
    

    This will install all the dependencies required by the Theme.

  • Now you can run grunt or grunt watch from the command line to begin the default watch task. This watches the SASS and Javascript files (anything inside assets/js/src/) for changes, and combines them into style.css and assets/js/scripts.min.js respectively.

  • Now you are ready to begin customising the theme for your specific project. The styling (CSS) is altered using SASS, which imports the Foundation styling automatically. You can add your own custom styles to the assets/scss/_theme.scss using SASS or plain CSS.

License

The license is carried over from WordPress, GNU GPL v2.