Slidedeck of presentation delivered to WordCamp Sacramento 2017.

1. Accelerating Custom
Development with
Dynamic Scaffolding
and WP-CLI
BEN BYRNE
CORNERSHOP CREATIVE
1

2. THE PROBLEM
2
“BUILD GOOD STUFF FAST”

3. PREMIUM THEMES
3
WHAT ABOUT

4. STARTER THEMES
4
OR MAYBE

5. STARTER THEMES
5
THEN WE HAVE
+ COMPONENT LIBRARIES

6. DYNAMIC
SCAFFOLDING
6
FOR OUR STARTER THEME

7. DON’T TRY THIS
AT HOME
7
MAYBE?

8. Goals
• Speed development (duh)
• Easy for new staff/devs to learn
• Theme should have everything it needs and
nothing it doesn’t
• Avoid reinventing wheels
• Avoid tedious, repetitive work (e.g. copy-paste)
8

9. WP-CLI
9
THE FOUNDATION

10. Why WP-CLI?
• broad support
• already offers basic scaffolding
• supports mustache templating
• easy documentation
10

11. Extending WP-CLI
• We built a plugin called Produce
(it could also be a package)
• It extends wp-cli with a new command
& subcommands
• When run, commands inject code into
our starter theme, Crate
11

12. Basic Flow
1. Make sure starter theme is active
2. Install & activate Produce plugin
3. Run WP-CLI commands to copy files
from the plugin to the theme
4. When done, uninstall the plugin
12

13. EXAMPLE
13

14. 14

15. 15

16. 16

17. Other Examples
• wp produce site-options
• wp produce term-fields
—taxonomies=category
• wp produce articles
—slug=news
—types=press release, in the news
—external-urls=both
17

18. Architecture
• Base class with methods, variables & helpers to
facilitate building commands
• Subdirectories for:
• commands
• ACF fieldgroups (in json)
• php includes
• js
• sass
• template files
• mustache
18

19. Articles files:
• commands/articles.php
• fieldgroups/articles-fields.json
• mustache/articles.mustache
• templates/single-article.php
19

20. Mustache templates
produce/mustache/loginscreen.mustache
20
function crate_login_logo() { ?>
<style type="text/css">
.login #login h1 a {
background-image: url('{{file}}');
background-size: contain !important;
width: {{width}};
height: {{height}};
}
body.login {
background: {{bg}};
}
</style>
<?php }
add_action( 'login_enqueue_scripts', 'crate_login_logo' );

21. Base Class methods
• prompt()
• enqueue()
• produce()
• next_steps()
• mustache_array()
21

22. Commands
class Articles_Command
extends CShop_Produce {
public function __invoke( $args,
$assoc_args ) {
// do things…
}
}
WP_CLI::add_command(
'produce site-options',
‘Articles_Command'
);
22

23. __invoke (1 of 2)
• $do_thing = self::prompt(
‘Make site awesome?',
array( 'Yes', 'No', 'Maybe' ),
'Yes'
);
• $this->enqueue( 'sample.js' );
• $this->enqueue(
'sample.mustache',
'/templates/sample.php', $data
);
23

24. __invoke (2 of 2)
• self::next_steps(
"@include 'sample'",
'core.sass'
);
• WP_CLI::success( 'I did that thing.' );
24

25. DON’T TOUCH NON-
GENERATED FILES
25
JUST TO BE SAFE

26. LINKS
• https://bitbucket.org/drywall/produce
• http://wp-cli.org/package-index/
• http://mustache.github.io/
• http://cshp.co/sacto2017
26

27. THANK YOU
27
@drywall
ben@cshp.co