List Block Customization

Another example of code that I’ve pulled from client work and anonymized. This modifies the core WordPress List block to do a few things:

  • Add a handful of new fields, one toggle and one color picker
  • Filters the frontend of the list block to add an inline variable for the selected color
  • Filters the editor to do the same, so that the selected color is immediately visible

The custom list markers are applied through CSS and so the only thing it really needs to do its magic is a different variable value for the color it should use for the marker.

The options for the color picker are populated from the theme’s palette.

Find the Custom List Markers on Github