Genesis Starter Theme

A starter theme for the Genesis Framework with a modern development workflow
Alternatives To Genesis Starter Theme
Project NameStarsDownloadsRepos Using ThisPackages Using ThisMost Recent CommitTotal ReleasesLatest ReleaseOpen IssuesLicenseLanguage
Tabler36,535133 days ago33August 24, 202371mitHTML
Tabler is free and open-source HTML Dashboard UI Kit built on Bootstrap
Ngx Admin24,938622 months ago11July 19, 2017476mitTypeScript
Customizable admin dashboard template based on Angular 10+
Bootswatch14,3771,60418816 days ago44September 20, 202349mitJavaScript
Themes for Bootstrap
React Toolbox8,7051,3101382 years ago66June 02, 2018267mitJavaScript
A set of React components implementing Google's Material Design specification with the power of CSS Modules
Nebular7,96045447a month ago94November 09, 2023887mitTypeScript
:boom: Customizable Angular UI Library based on Eva Design System :new_moon_with_face::sparkles:Dark Mode
Sphinx_rtd_theme4,5532,0045,98617 days ago52November 28, 2023243mitSass
Sphinx theme for readthedocs.org
Minima3,20325,661919 days ago15August 16, 201946mitSCSS
Minima is a one-size-fits-all Jekyll theme for writers.
Understrap3,0088135 days ago37November 08, 202175gpl-3.0CSS
Underscores + Bootstrap = Understrap, the renowned open-source WordPress starter theme.
Modular Admin Html2,79123 years ago2April 12, 201959otherHTML
ModularAdmin - Free Dashboard Theme Built On Bootstrap 4 | HTML Version
Foundationpress2,722
4 years ago35April 12, 201955mitPHP
FoundationPress is a WordPress starter theme based on Foundation 6 by Zurb
Alternatives To Genesis Starter Theme
Select To Compare


Alternative Project Comparisons
Readme

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

Popular Theme Projects
Popular Sass Projects
Popular User Interface Categories
Related Searches

Get A Weekly Email With Trending Projects For These Categories
No Spam. Unsubscribe easily at any time.
Php
Theme
Sass
Flexbox
Mobile First
Wordpress Starter Theme