Skip to content

Latest commit

 

History

History
99 lines (78 loc) · 3.16 KB

README.md

File metadata and controls

99 lines (78 loc) · 3.16 KB
Raw

Reen Starter Theme

Reen is a WordPress starter theme based on HTML5 Boilerplate, gulp, Bower, and Sass, that will help you make better themes.

  • Extras - A collection functions and filters that are essential
  • Snippets - A collection of code snippets that might be useful
  • Plugins - A collection of plugins that are recommended
  • .htaccess example - A .htaccessexample

Requirements

Prerequisite How to check How to install
PHP >= 5.4.x php -v php.net
Node.js 0.12.x node -v nodejs.org
gulp >= 3.8.10 gulp -v npm install -g gulp
Bower >= 1.3.12 bower -v npm install -g bower

Install Wordpress

mkdir new-wordpress-project
cd new-wordpress-project
wget http://wordpress.org/latest.tar.gz
tar xfz latest.tar.gz
mv wordpress/* ./
rmdir ./wordpress/
rm -f latest.tar.gz
mv wp-config-sample.php wp-config.php

Symlink project folder to MAMP/htdocs

cd ~/Applications/MAMP/htdocs
ln -s /path/to/new-wordpress-project symlink-name

Theme Installation

Specify environment

subl wp-config.php // Open wp-config.php with fav editor
define('WP_ENV', 'development'); // Add this for development environment
define('WP_ENV', 'production'); // Add this for production environment

Download and Install Reen

cd wp-content/themes/
git clone [email protected]:ucarmetin/reen.git
npm install -g npm@latest // node.js, latest version
npm install -g gulp bower // gulp and bower, latest versions
cd wp-content/themes/reen/ // Navigate to the theme directory
npm install // Install dependencies
bower install // Install bower dependencies

Configuration

Edit lib/config.php to enable or disable theme features and to define a Google Analytics ID.

Edit lib/init.php to setup navigation menus, post thumbnail sizes, post formats, and sidebars.

gulp commands

  • gulp — Compile and optimize the files in your assets directory
  • gulp watch — Compile assets when file changes are made
  • gulp --production — Compile assets for production (no source maps).

Using BrowserSync

To use BrowserSync during gulp watch you need to update devUrl at the bottom of assets/manifest.json to reflect your local development hostname.

For example, if your local develoment URL looks like http://localhost:8888/project-name/ you would update the file to read:

...
  "config": {
    "devUrl": "http://localhost:8888/project-name/"
  }
...

Sycn with production

Sublime FTP package with the config file, sftp-config.json, can be used for file synchronization between development and remote server.

Sage

Sage documentation is available at https://roots.io/sage/docs/.

Soil

Install the Soil plugin to enable additional features:

  • Cleaner output of wp_head and enqueued assets
  • Root relative URLs
  • Nice search (/search/query/)