Need help with genesis-starter-theme?
Click the “chat” button below for chat support from the developer who created it, or find similar developers for support.

About the developer

seothemes
142 Stars 42 Forks 371 Commits 4 Opened issues

Description

A starter theme for the Genesis Framework with a modern development workflow

Services available

!
?

Need anything else?

Contributors list

# 213,327
PHP
Gulp
Sass
mobile-...
334 commits
# 491,593
nginx
Gulp
Sass
CSS
3 commits
# 544,438
Gulp
Sass
wordpre...
CSS
2 commits
# 286,964
grunt
mailgun
CSS
Gulp
1 commit
# 712,517
Gulp
Sass
wordpre...
JavaScr...
1 commit
# 346,871
WordPre...
optimiz...
Gulp
Sass
1 commit

Genesis Starter Theme

WordPress License

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

It uses Laravel Mix as a build tool to automate mundane development tasks like compiling SCSS and minifying images.

Check out the live demo

Genesis Starter Theme screenshot

Table of Contents

Features

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

Requirements

| Requirement | How to Check | How to Install | | :---------- | :----------- | :------------- | | PHP >= 5.4 |

php -v
| php.net | | WordPress >= 5.2 |
Admin Footer
| wordpress.org | | Genesis >= 3.1.1 |
Theme Page
| studiopress.com | | Composer >= 1.5.0 |
composer --version
| getcomposer.org | | Node >= 9.10.1 |
node -v
| nodejs.org | | NPM >= 5.6.0 |
npm -v
| npm.js | | Yarn >= 0.2.x |
yarn -v
| yarnpkg.com |

Installation

One line command:

Install the latest development version of the Genesis Starter Theme using Composer from your WordPress themes directory (replace

your-theme-name
below with the name of your theme):
composer create-project seothemes/genesis-starter-theme your-theme-name dev-master && cd "$(\ls -1dt ./*/ | head -n 1)" && npm install && npm run build

Individual commands:

Install the latest development version of the Genesis Starter Theme using Composer from your WordPress themes directory (replace

your-theme-name
below with the name of your theme):
composer create-project seothemes/genesis-starter-theme your-theme-name dev-master

Navigate into the theme's root directory:

cd your-theme-name

Install node dependencies, build the theme assets and kick-off BrowserSync:

npm install && npm run build

Structure

your-theme-name/    # → Root directory
├── assets/         # → Front-end assets
├── config/         # → Config directory
├── lib/            # → Theme functions
│   ├── functions/  # → General functions
│   ├── plugins/    # → Plugin functions
│   ├── shortcodes/ # → Shortcode functions
│   ├── structure/  # → Structural functions
│   └── init.php    # → File autoloader 
├── templates/      # → Page templates
├── tests/          # → PHP Unit tests
├── vendor/         # → Composer packages
├── node_modules/   # → Node.js packages
├── composer.json   # → Composer settings
├── package.json    # → Node dependencies
├── webpack.mix.js  # → Laravel mix config
├── screenshot.png  # → Theme screenshot
├── functions.php   # → Loads init files
└── style.css       # → Blank stylesheet

Usage

Project details such as theme name, author, version number etc should only ever be changed from the

package.json
file. Laravel Mix reads this file and automatically places the relevant information to the correct locations throughout the theme.

Static assets are organized in the

assets
directory. This folder contains theme scripts, styles, images, fonts, views and language translation files. All of the main theme styles are contained in the
assets/css/main.css
file, the
style.css
file at the root of the theme is left blank intentionally and only contains the required stylesheet header comment.

Autoloading classes and files

Classes

The Genesis Starter Theme automatically loads classes placed in the

lib/classes/
directory via the Composer autoloader. Once you have added your additional files, run the following command to regenerate the autoloader:
composer dump-autoload --no-dev

Files

File loading is handled by the

lib/init.php
file. Simply add or remove files from the directory/filename array.

Development

Please refer to the Laravel Mix documentation for further information on how to use the

webpack.mix.js
file.

All build tasks are located in the theme's

package.json
file, under the scripts section.

Contributing

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

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:

Christoph Herr, Gary Jones, Tonya Mork, Tim Jensen, Justin Tadlock

We use cookies. If you continue to browse the site, you agree to the use of cookies. For more information on our use of cookies please see our Privacy Policy.