|
1 | | -# Sage Child Theme Support |
| 1 | +# Nutshell: Enhanced Acorn Support for WordPress Themes |
2 | 2 |
|
3 | 3 | [](https://github.com/yardinternet/skeleton-package/actions/workflows/format-php.yml) |
4 | 4 | [](https://github.com/yardinternet/skeleton-package/actions/workflows/phpstan.yml) |
5 | | -<!-- [](https://github.com/yardinternet/skeleton-package/actions/workflows/run-tests.yml) --> |
6 | | -<!-- [](https://github.com/yardinternet/skeleton-package/actions/workflows/badges.yml) --> |
7 | 5 |
|
8 | | -Classes to use Acorn with child themes: |
| 6 | +**Nutshell** is a feature-rich package designed to extend [Acorn](https://roots.io/acorn/) for WordPress themes. It provides a flexible foundation for advanced theme development, including configuration inheritance, Sentry integration, Vite asset support, and more. |
9 | 7 |
|
10 | | -- WP like inheritance for config files; child config will override parent configuration. |
11 | | -- No directory scans, everything is configuration based. |
| 8 | +## Features |
| 9 | + |
| 10 | +- **Child Theme Configuration Inheritance**: |
| 11 | + - Allows child themes to override parent configuration files without directory scans. |
| 12 | + - Uses a custom configuration repository to support unsetting and merging config values. |
| 13 | +- **Vite Asset Support**: |
| 14 | + - Integrates with Vite for modern asset bundling and hot reloading. |
| 15 | +- **Sentry Integration**: |
| 16 | + - Seamless error reporting via Sentry for Laravel. |
| 17 | +- **Custom View Composers**: |
| 18 | + - Manual registration of view composers for fine-grained control. |
| 19 | +- **Custom Console Commands**: |
| 20 | + - Register custom Artisan commands via configuration. |
12 | 21 |
|
13 | 22 | ## Requirements |
14 | 23 |
|
15 | | -- [Acorn](https://github.com/roots/acorn) >= 4.0 |
| 24 | +- PHP >= 8.1 |
| 25 | +- [Acorn](https://github.com/roots/acorn) ^4.3 |
| 26 | +- Composer |
16 | 27 |
|
17 | 28 | ## Installation |
18 | 29 |
|
19 | | -To install this package using Composer, follow these steps: |
20 | | - |
21 | | -1. Add the following to the `repositories` section of your `composer.json`: |
22 | | - |
23 | | - ```json |
24 | | - { |
25 | | - "type": "vcs", |
26 | | - "url": "git@github.com:yardinternet/sage-child-theme-support.git" |
27 | | - } |
28 | | - ``` |
| 30 | +1. Install this package with composer |
29 | 31 |
|
30 | | -2. Install this package with Composer: |
| 32 | + ```sh |
| 33 | + composer require yard/nutshell |
| 34 | + ``` |
31 | 35 |
|
32 | | - ```sh |
33 | | - composer require yard/sage-child-theme-support |
34 | | - ``` |
35 | | - |
36 | | -## Configuration |
| 36 | +2. Ensure your project's `composer.json` uses PSR-4 autoloading for your theme and childtheme and remove any redundant autoloading from the theme itself. |
37 | 37 |
|
38 | | -1. Create a child theme with Sage as the parent theme ([How To Create A Child Theme | Wordpress.org](https://developer.wordpress.org/themes/advanced-topics/child-themes/#how-to-create-a-child-theme)) |
39 | | - |
40 | | - Example `style.css`: |
41 | | - |
42 | | - ```css |
43 | | - /** |
44 | | - * Theme Name: Sage Child Theme |
45 | | - * Template: sage |
46 | | - * Theme URI: https://www.example.com/sage-child/ |
47 | | - * Description: Sage child theme |
48 | | - * Version: 1.0.0 |
49 | | - * Author: Example Inc. |
50 | | - * Author URI: http://www.example.com/ |
51 | | - * Text Domain: sage |
52 | | - * License: MIT License |
53 | | - * License URI: https://opensource.org/licenses/MIT |
54 | | - * Requires PHP: 8.1 |
55 | | - * Requires at least: 5.9 |
56 | | - */ |
57 | | - ``` |
58 | | - |
59 | | -2. Add PSR-4 autoloading for your child theme to your (root) `composer.json`: |
60 | | - |
61 | | - ```diff |
62 | | - "autoload": { |
| 38 | + ```diff |
| 39 | + "autoload": { |
63 | 40 | "psr-4": { |
64 | | - "App\\": "web/app/themes/sage/app/", |
65 | | - + "ChildTheme\\App\\": "web/app/themes/child-theme/app/", |
| 41 | + "App\\": "web/app/themes/sage/app/", |
| 42 | + + "ChildTheme\\App\\": "web/app/themes/child-theme/app/", |
66 | 43 | } |
67 | | - }, |
68 | | - ``` |
69 | | - |
70 | | - Remove the autoloading from your theme `composer.json` if applicable. |
71 | | - |
72 | | -3. In `sage/config/app.php` change: |
73 | | - |
74 | | - ```diff |
75 | | - -use Roots\Acorn\ServiceProvider; |
76 | | - +use Yard\SageChildThemeSupport\ServiceProvider; |
77 | | - ``` |
78 | | - |
79 | | -4. In `sage/functions.php` change: |
| 44 | + }, |
| 45 | + ``` |
80 | 46 |
|
81 | | - ```diff |
82 | | - -\Roots\bootloader()->boot(); |
83 | | - +define('ACORN_BASEPATH', __DIR__); |
84 | | - +\Yard\SageChildThemeSupport\bootloader()->boot(); |
85 | | - ``` |
86 | | - |
87 | | -5. Add view composers to `config/view.php` |
88 | | - |
89 | | - ```diff |
90 | | - - 'composers' => [], |
91 | | - + 'composers => [ |
92 | | - + 'app' => App\View\Composers\App::class, |
93 | | - + 'comments' => App\View\Composers\Comments::class, |
94 | | - + 'post' => App\View\Composers\Post::class, |
95 | | - + ], |
96 | | - ``` |
97 | | - |
98 | | -6. Add any custom console commands to `config/console.php`: |
99 | | - |
100 | | - ```diff |
101 | | - + 'commands => [ |
102 | | - + 'test' => App\Console\Commands\Test::class, |
103 | | - + ], |
104 | | - ``` |
| 47 | +## Configuration |
105 | 48 |
|
106 | 49 | > [!IMPORTANT] |
107 | 50 | > After this change: |
108 | 51 | > |
109 | 52 | > - View Composers in the app/View/Composers directory will no longer be loaded automatically. To ensure they are registered, you have to configure them manually. |
110 | 53 | > - Console Commands in the app/Console/Commands directory will no longer be loaded automatically. To ensure they are register, you have to configure them manually. |
111 | 54 |
|
| 55 | +1. **Child Theme Setup** |
| 56 | + - Create a child theme with Sage as the parent theme. See [WordPress Child Themes](https://developer.wordpress.org/themes/advanced-topics/child-themes/#how-to-create-a-child-theme). |
| 57 | + |
| 58 | + Example `style.css`: |
| 59 | + |
| 60 | + ```css |
| 61 | + /** |
| 62 | + * Theme Name: Sage Child Theme |
| 63 | + * Template: sage |
| 64 | + * Theme URI: https://www.example.com/sage-child/ |
| 65 | + * Description: Sage child theme |
| 66 | + * Version: 1.0.0 |
| 67 | + * Author: Example Inc. |
| 68 | + * Author URI: http://www.example.com/ |
| 69 | + * Text Domain: sage |
| 70 | + * License: MIT License |
| 71 | + * License URI: https://opensource.org/licenses/MIT |
| 72 | + * Requires PHP: 8.1 |
| 73 | + * Requires at least: 5.9 |
| 74 | + */ |
| 75 | + ``` |
| 76 | + |
| 77 | + - Place your configuration files in `config/` within your child theme directory. These will be merged with the parent configuration where child theme configuration takes precedence. To unset a configuration option from the parent theme in the child theme you can pass an empty array for that configuration option. |
| 78 | + |
| 79 | +2. **Update Acorn Bootloader** |
| 80 | + |
| 81 | + - In your theme's `functions.php`, use the `Yard\Nutshell\bootloader()` helper to bootstrap Acorn with Nutshell's enhancements. |
| 82 | + |
| 83 | + ```diff |
| 84 | + -\Roots\bootloader()->boot(); |
| 85 | + +define('ACORN_BASEPATH', __DIR__); |
| 86 | + +\Yard\Nutshell\bootloader()->boot(); |
| 87 | + ``` |
| 88 | + |
| 89 | +3. **Register View Composers** |
| 90 | + - Add your view composers to `config/view.php` under the `composers` key. Automatic discovery is disabled for explicit control. |
| 91 | + |
| 92 | + ```diff |
| 93 | + - 'composers' => [], |
| 94 | + + 'composers => [ |
| 95 | + + 'app' => App\View\Composers\App::class, |
| 96 | + + 'comments' => App\View\Composers\Comments::class, |
| 97 | + + 'post' => App\View\Composers\Post::class, |
| 98 | + + ], |
| 99 | + ``` |
| 100 | + |
| 101 | +4. **Register Console Commands** |
| 102 | + - Add custom Artisan commands to `config/console.php` under the `commands` key. |
| 103 | + |
| 104 | + ```diff |
| 105 | + + 'commands => [ |
| 106 | + + 'test' => App\Console\Commands\Test::class, |
| 107 | + + ], |
| 108 | + ``` |
| 109 | + |
| 110 | +5. **Vite Integration** |
| 111 | + - Vite is enabled by default. Use the provided `Yard\Nutshell\Assets\Vite` class for asset management. |
| 112 | + |
| 113 | +6. **Sentry Integration** |
| 114 | + - Sentry is automatically integrated if `sentry/sentry-laravel` is installed and configured. |
| 115 | + |
112 | 116 | ## Usage |
113 | 117 |
|
114 | | -To override configuration for your child theme add the relevant files to the `child-theme/config` directory. |
115 | | -The configuration for the child theme is merged with the parent configuration where child theme configuration takes precedence. To unset a configuration option from the parent theme in the child theme you can pass an empty array for that configuration option. |
| 118 | +- **Configuration Inheritance**: Any config file in your child theme's `config/` directory will override the parent. Empty config files will unset the corresponding configuration. |
| 119 | +- **View Composers**: Register all composers manually in `config/view.php`. |
| 120 | +- **Console Commands**: Register all commands manually in `config/console.php`. |
| 121 | +- **Vite**: Use the `@vite` directive or helper as usual; Nutshell ensures correct asset paths. |
| 122 | +- **Sentry**: Errors and exceptions are reported to Sentry automatically. |
| 123 | + |
| 124 | +## Contributing |
| 125 | + |
| 126 | +Pull requests are welcome! Please ensure code style and tests pass before submitting. |
0 commit comments