Replacement for DimensionControl: Component for setting dimensions?

  • oguruma

    (@oguruma)


    1 week ago

    I’m building a custom block and I need a good component(s) to use to allow the user to set the padding and margins.

    I think the DimensionControl was built for this, but I see in the docs that it’s deprecated.

    Is there a replacement for this other than just building it entirely from other components?

Viewing 1 replies (of 1 total)

  • However, you can still achieve similar functionality using other components and approaches. Here are a few options:

    1. Spacing Control via theme.json: You can define padding and margin controls in your theme.json file. This allows you to manage spacing settings globally or per block. Here’s an example:

    {
    “version”: 2,
    “settings”: {
    “spacing”: {
    “units”: [“px”, “em”, “rem”, “%”],
    “customSpacing”: true
    }
    },
    “styles”: {
    “core/paragraph”: {
    “spacing”: {
    “padding”: “20px”,
    “margin”: “10px”
    }
    }
    }
    }

    2. Custom Controls: You can create custom controls using existing components like RangeControl or TextControl to allow users to set padding and margins. Here’s a basic example:

Viewing 1 replies (of 1 total)
  • You must be logged in to reply to this topic.