Genese is a WordPress starter theme with a modern front-end development workflow.
Based on HTML5 Boilerplate, BrowserSync & WebPack (HMR).
๐ Modern front-end development workflow:
- Hot Module Replacement for Js & Scss files.
- BrowserSync to watch changes on PHP files.
๐ WordPress development workflow enhanced:
- Template wrapper: removes repetitive inclusions in template files.
- A nice organization of the code with some SEO snippets.
git clone https://github.com/mystroken/genese.git
cd genese && rm -rf .git/
genese/ # โ Root folder for the project
โโโ app/
โโโ inc/ # โ WordPress Hooks and miscellanous helper functions.
โโโ walkers/
โโโ resources/
โโโ assets/ # โ Frontend assets source and Configs of compiling process.
โโโ lang/
โโโ scripts/ # โ Do touch, scripts to compile assets.
โโโ template-parts/
First you should get Nodejs installed on your machine. Then install npm dependencies
npm install
Configure the assets bundling
./resources/assets/config.js
Start the dev script
npm run start
npm run build
- 3.1.1 โ Customize webpack
- 3.1.2 โ Include scripts into WordPress
- 3.2.1 โ Declare navigations
- 3.2.2 โ Declare widget areas (sidebars)
- 3.3.1 โ Customize the base template
- 3.3.2 โ Customize the template parts
- 3.3.2.1 โ Index views (index.php, archive.php, search.php)
- 3.3.2.2 โ Single views (single.php, page.php)