CA.gov Design System Gutenberg Blocks

What this plugin does

Integrates the State of California Design System into the WordPress Gutenberg editor.

The CA Design System defines “Content Components”. Content components are structured markup, with CSS and/or JavaScript as custom elements.

Gutenberg is an open-source editor that is included in core WordPress, version 5.0 and later.
This editor tool allows content editors to use pre-defined markup blocks in content.
Supports Office of Data & Innovation headless/static site publishing features.

Install and enable this plugin
This will create a WordPress Block library with blocks and patterns that is available in the Gutenberg Editor UI "CA Design System"
Keep the plugin up-to-date for important security and design updates.
Check our CHANGELOG for notifications of major upgrades, or to keep content in sync with design system changes.

Review guidance for content editors
- Please also check the principles and content principles of the design system for more information on improving content for State of California website users.
The Office of Data and Innovation has drafted content guidance for content editors on our systems.
- If needed please reach out to the Design System team until we are able to publish the full version for any site using these Gutenberg Blocks.

Since the Design System is in continuous development, components are continuously improved.
All Design System components are versioned. This means you can coordinate your update on your own schedule and test your update to make sure that everything is working well.
Check the maintenance docs on how to perform a code update.

Compatible themes that implement the CA Design System
- CAWeb theme Version (1.6.2) - For production sites (Requires Divi, a third party plugin, not free.)
- DEVELOPMENT: Design System WordPress theme - In development Intended for decoupled WordPress instances only. Note that the editor layout doesn't have visual parity with production because WordPress is only used as a CMS backend with the REST API endpoint, and all previews take place in build code on GitHub.
- A performant, monolithic + headless compatible theme is being discussed, but requires that the Design System matures a little more before this would be something that could be adopted and developed for broader use.

We are aligning with the CAWeb State Template theme.
This is the same codebase that will be used in the CAWeb theme in the future.
CDT is working on a gulp bundler. ODI will sync that format with this plugin for 2.0.0 release (requires refactoring some in-production block features.)

The best way to stay up to date (and meet other State technologists) is to join the Digital Web Services Network (DWSN). This quarterly meeting is open to all State employees and topics on the Design System are presented there.
The State Template is still being converted to the Design System, and this work will continue throughout 2022.

The Office of Data and Innovation maintains several Pantheon instances that seamlessly and securely run our Content Management System (CMS). The cost is generally low, and we have been able to procure it for our own use. However, we are creating "headless", "decoupled" sites, which differ from traditional monolithic use of WordPress. We hope to share more information about this system in the future.
Multiple departments are currently prototyping aspects of the Design System and coordinating with each other on pilot sites.
ODI works with CDT and various State control agencies to make sure that we are following security best practices.

Your help is important and will help us deliver services to Californians while maintaining our committments to accessibility, performance and equity.

To contribute

Please submit a pull request to this repository and the Design System team will review it.