A simple solution would be to register custom block style variations for the core/columns
block and let the user select your custom padding settings from these, instead of editing class names in the extra classes field (which isn’t too comfortable from a user’s perspective). Gutenberg automatically outputs class names in the form is-style-(name of block style variation)
when a variation is selected and you can also set a default one. You can do it with JS, more info here: https://developer.wordpress.org/block-editor/reference-guides/filters/block-filters/#block-style-variations
Or, quite simply, with PHP: https://developer.wordpress.org/block-editor/reference-guides/filters/block-filters/#server-side-registration-helper
But if you need some granular control style variations are not the right solution.
More “premium” would be to add a custom Inspector Controls panel for your padding settings in the block sidebar with wp.hooks
. But you will need to write hooks for settings
with blocks.registerBlockType
(for your custom padding attribute(s)), for edit
with editor.BlockEdit
(the sidebar controls’ logic and maybe editor classes – if you want to show the changes on-the-fly in the editor) and for save
with blocks.getSaveElement
( to bring your classes to frontend). Much fun but way more work 😉
Starting point: https://developer.wordpress.org/block-editor/reference-guides/filters/block-filters/#filters