Today I Learned - Rocky Kev

TIL Blocks Vs Themes Style responsibility in WordPress

POSTED ON:

TAGS: wordpress

With WordPress moving to Block-style development, we are now reaching the unknown of responsibility.

Who manages CSS Styles? Blocks or Themes?

Musically speaking, the intention is that the theme is the conductor of the blocks orchestra. The general aim is that we can absorb most if not all the structural responsibilities into blocks, and a large part of the style directives into blocks and elements. We can use the 80% rule there, but in a fairly loose way, mostly as set of expectations. Container blocks adopt positioning and layout responsibilities allowing the theme to focus on composition and styling. It also ensures multiple blocks — including third-parties — compose natively well together.

reference from github discussion

** The theme's responsibility: **
Composition - How to lay out the blocks. Being able to read it.

For example:

(via https://webdesign.tutsplus.com/articles/an-introduction-to-composition--webdesign-14508)

Styling - how it looks at the end. Maybe it's spacing between blocks, or layout with responsive design.

** The container blocks responsibility: **

Positioning and layout - How the elements look. Like spacing between header, subheader.

(via https://morioh.com/p/848328c1a1ff)

Related TILs

Tagged: wordpress

TIL Static Blocks vs Dynamic Blocks

A static block is a piece of content whose markup is known when the page is saved. The block saves its content and markup directly in the post content. A dynamic block is a piece of content whose markup and exact content are not known when the page is saved.

TIL how to convert a shortcode to a WP block

Traditionally, shortcodes were a way that plugin developers could provide users the ability to add specific plugin functionality anwhere on their site. But shortcodes are not very user friendly, nor was hunting down the relevant data you needed to render the correct data for the shortcode. Converting existing shortcodes to blocks provides a much greater user experience in all aspects.

TIL how WordPress does serverside

This isn't fully accurate, but for the means of describing server-side rendering, it's a good start!