WordPress Starter Theme
A fork of Automattic's _s, with modern CLI tooling based on NPM scripts. No Gulp, Grunt, or Webpack required.
Features
HMR
- When you change a
.php
,.scss
,.svg
, or.js
file, BrowserSync will make changes via hot module reloding.
WordPress Coding Standards via:
Enforcement of- PHPCS
- ESLint
- StyleLint
With each file change during npm run watch
, you'll be notified in the command line of code warnings and errors.
Asset minification
Sass and other assets are compiled, optimized, and minified to a /dist
directory.
- SCSS
- JavaScript
- Images
- SVG icons
Localization
.pot
file automatically generated on each build.
Prerequisites
Getting Started
If you want to set things up manually, download this repo from GitHub.
The first thing you want to do is copy the _s
directory and change the name to something else (like, say, my-theme
), and then you'll need to do a five-step find and replace on the name in all the templates.
- Search for
'_s'
(inside single quotations) to capture the text domain. - Search for
_s_
to capture all the function names. - Search for
Text Domain: _s
instyle.css
. - Search for
_s
(with a space before it) to capture DocBlocks. - Search for
_s-
to capture prefixed handles.
OR
- Search for:
'_s'
and replace with:'my-theme'
. - Search for:
_s_
and replace with:my_theme_
. - Search for:
Text Domain: _s
and replace with:Text Domain: my-theme
instyle.css
. - Search for:
_s
and replace with:My_Theme
. - Search for:
_s-
and replace with:my-theme-
.
Then, update the stylesheet header in style.css
, the links in footer.php
with your own information and rename _s.pot
from languages
folder to use the theme's slug. Next, update or delete this readme.
Setup
Install
npm i
Set your proxy URL in package.json
under the serve
task.
browser-sync start --https --proxy 'https://my-theme.test' --files \'dist/css/*.css, dist/js/*.js, **/*.html, !node_modules/**/*.html\'
(or you could remove the proxy... your choice!)
Watch
npm run watch
Now you're ready to go! The next step is easy to say, but harder to do: make an awesome WordPress theme. :)
Contributions are welcome, and good luck!