README

A developer-friendly starter theme used for creating commercial child themes for the Genesis Framework.

It uses Composer to pull in the Core component library which provides the PHP logic for the theme's configuration, and it uses Gulp WP Toolkit to automate mundane build tasks like compiling SCSS and minifying images.

Check out the live demo

Table of Contents

• Features
• Requirements
• Installation
  • One line command
  • Individual commands
• Setup
• Usage
• Development
• Structure
• Contributing
• Authors
• Special Thanks

Features

The Base aims to modernize, organize and enhance some aspects of Genesis child theme development. Take a look at what is waiting for you:

• Bourbon as a lightweight Sass toolkit
• Gulp for automating development build tasks
• Browsersync for synchronized browser testing
• Config-based, OOP modular architecture
• CLI setup script to automatically update information
• Yarn or NPM for managing Node dependencies
• Composer for managing PHP dependencies
• PSR-4 class autoloading
• Namespaced to avoid naming conflicts

Requirements

Installation

One line command:

Install the latest development version of the Base using Composer from your WordPress themes directory (replace your-theme-name below with the name of your theme):

composer create-project seothemes/base your-theme-name dev-master && cd "$(\ls -1dt ./*/ | head -n 1)" && sh setup.sh

Individual commands:

Install the latest development version of the Base using Composer from your WordPress themes directory (replace your-theme-name below with the name of your theme):

composer create-project seothemes/base your-theme-name dev-master

Navigate into the theme's root directory:

cd your-theme-name

Run the setup script to rename the theme, build the theme assets and kick-off BrowserSync:

sh setup.sh

Setup

The Base includes a powerful setup script which automates the process of updating theme details:

It replaces the following details with your own:

• Theme name
• Theme textdomain
• Theme author
• Theme author URL
• Theme development URL
• Theme namespace
• Theme version

Usage

The Base is intended to be used with SEO Themes Core. All changes to the child theme should be made via the theme configuration file. This can be used to change almost every aspect of the theme, including theme features, navigation menus, image sizes, widget areas and more. An example config file is included with this theme.

Components are only loaded when a config key is provided. They can be added or removed depending on the requirements of your project. For example, to remove the PluginActivation component, simply remove it's config key from the return statement in config/defaults.php.

The app directory is provided to house project-specific PHP files if additional functionality is required. It comes pre-configured with PSR-4 autoloading. Custom components can be created in the same way other Core components are, by first creating a class which extends the Component class and then adding it's configuration to the theme's config file. An Example Component is included with the theme to get you started.

Project details such as theme name, author, version number etc should only ever be changed from the package.json file. The Gulp build task reads this file and automatically places the relevant information to the correct locations throughout the theme.

Static assets are organized in the resources directory. This folder contains theme scripts, styles, images, fonts, views and language translation files.

Development

Please refer to the Gulp WP Toolkit Instructions for a complete list of available build tasks.

In addition to Gulp WP Toolkit's tasks, there is also a zip task which can be used to generate an archive of your theme, including the required composer package files and none of the unnecessary files. The list of included files can be modified from the toolkit.extendConfig.src.zip config in the Gulpfile.

Structure

your-theme-name/    # → Root directory
├── app/            # → Theme PHP files
│   └── Example.php # → Example component
├── config/         # → Config directory
│   └── config.php  # → Theme settings
├── resources/      # → Front-end assets
│   ├── fonts/      # → Theme fonts
│   ├── img/        # → Theme images
│   ├── js/         # → Theme JavaScript
│   ├── lang/       # → Translation files
│   ├── scss/       # → Sass partials
│   └── views/      # → Theme templates
├── node_modules/   # → Node.js packages
├── vendor/         # → Composer packages
├── composer.json   # → Composer settings
├── functions.php   # → Composer autoloader
├── front-page.php  # → Front page template
├── Gulpfile.js     # → Gulp config
├── package.json    # → Node dependencies
├── screenshot.png  # → Theme screenshot
├── setup.sh        # → CLI setup script
├── style.css       # → Theme stylesheet
└── woocommerce.css # → WooCommerce styles

Contributing

Contributions are welcome from everyone. We have contributing guidelines to help you get started.

Authors

See also the list of contributors who participated in this project.

Special Thanks

A shout out to anyone who's code was used in or provided inspiration to this project:

Craig Simpson, Christoph Herr, Gary Jones, Tim Jensen, Bill Erickson, Sridhar Katakam, Nathan Rice, Brian Gardner