Blocks are styled on the front end using plain CSS. This means a theme's appearance can be modified in any way through CSS by adding to or overriding optional bundled block styles.
- [Instructor] So far in the course we've focused on…making sure blocks worked properly in the theme.…In this chapter we'll turn…our attention to deeper integration,…modifying block styles to better fit the theme…and extending the functionality of blocks…through style variations.…The block editor is opinionated,…meaning it makes a lot of decisions about…what different blocks should look like on the front end.…As a theme designer or developer…you can impose your own opinions on any block through CSS…to make that block integrate…the way you want into your theme.…
The theme unit test data that you see…here is an essential part of this process,…as it gives you every available blocks…so you can check what they look like in your theme…and know when you need to make changes and modifications.…Modifying or overriding block styles with your theme…is a straightforward process.…So let me show you an example of how this is done.…Out of the box, the block editor lays out image galleries…like the one you see here using the flex layout module.…
Released
1/22/2019- Declaring support for default block styles
- Adding support and styles for wide alignment
- Supporting theme-specific colors and fonts
- Extending block styles
- Adding new style variations
Share this video
Embed this video
Video: Extending block styles