This is just a fork of Genesis Sample theme 2.8.0 with added Sass, including Gutenberg Front End and Editor partials. No other changes (js/php etc.), other than the CSS style sheets are now compiled from the Sass partials.
Huge thanks for Christoph Herr @christophherr for inspiration and help via his Prometheus Starter theme based on Genesis Starter 2.6 https://github.com/christophherr/prometheus and to Sridhar Katakam @srikat for further development on Sass partials based on that. However any bugs, errors and general bad coding practice here will be mine and not theirs.
Most Sass partials are @imported into scss/style.scss
as normal but note the following exceptions:
Each plugin e.g. Genesis Simple FAQ has a separate small partial in scss/partials/plugins
, which are imported into scss/partials/_plugins.scss
(which is in turn imported into scss/style.scss
as normal). The idea is to make it easy to add new style sheets for often-used plugins and @import them, and/or comment out existing @imports as appropriate.
scss/gutenberg/front-end.scss
and
scss/gutenberg/style-editor.scss
should be compiled directly to lib/gutenberg/front-end.css
and lib/gutenberg/style-editor.css
respectively, and not imported to scss/style.scss
To facilitate this, the above 2 scss files @import the ../partials/variables
partial directly.
Similarly, the file
scss/woocommerce/genesis-sample-woocommerce.scss
should be compiled directly to lib/woocommerce/genesis-sample-woocommerce.scss
and not imported to scss/style.scss
There is a Codekit 3 configuration file included for those using that app (https://codekitapp.com). So, dragging the entire genesis-sample
child theme folder into Codekit 3 should create a new project with the correct compile paths. If using a local server such as Desktop Server or Local by Flywheel, you'll also need to edit the Codekit project to add the correct External Server Address e.g. http://genesis-sample.test
etc.
If you use command line tools like Gulp then you'll need to add your own configuration files and install the components you need.
Original Genesis Sample Theme Read Me follows.
GitHub project link: https://github.com/studiopress/genesis-sample/.
- Upload the Genesis Sample theme folder via FTP to your wp-content/themes/ directory. (The Genesis parent theme needs to be in the wp-content/themes/ directory as well.)
- Go to your WordPress dashboard and select Appearance.
- Activate the Genesis Sample theme.
- Inside your WordPress dashboard, go to Genesis > Theme Settings and configure them to your liking.
Please visit https://my.studiopress.com/help/ for theme support.
The version of Genesis Sample on GitHub includes tooling to check code against WordPress standards. To use it:
- Install Composer globally on your development machine. See Composer setup steps.
- In the command line, change directory to the Genesis Sample folder.
- Type the command
composer install
to install PHP development dependencies. - Type
composer phpcs
to run coding standards checks.
You'll see output highlighting issues with PHP files that do not conform to Genesis Sample coding standards.
Scripts are also provided to help with CSS linting, CSS autoprefixing, and creation of pot language files. To use them:
- Install Node.js, which also gives you the Node Package Manager (npm).
- In the command line, change directory to the Genesis Sample folder.
- Type the command
npm install
to install dependencies.
You can then type any of these commands:
npm run autoprefixer
to add and remove vendor prefixes instyle.css
.npm run makepot
to regenerate thelanguages/genesis-sample.pot
file.npm run lint:css
to generate a report of style violations forstyle.css
.npm run zip
to create a genesis-sample.zip of the current branch. Excludes files marked export-ignore in.gitattributes
.
- Follow the install instructions for npm scripts above.
- Switch to the git branch you plan to distribute.
- Bump version numbers manually and commit those changes.
- Type
npm run zip
to creategenesis-sample.zip
. Files marked export-ignore in.gitattributes
are excluded from the zip.
The zip
command is an alias for git archive -o genesis-sample.zip --prefix=genesis-sample/ HEAD
.