Blocks Controls

Each block has options to let the user customize it, you need to create block controls by clicking on “Add Control” button. You can create as many controls per block as you want.

Control Settings

These settings will be available for the most of control types.

  • Label – display label. This name will be shown on the Gutenberg editor inside block¬†settings
  • Name – control name, that will be available by accessing it in HTML code output. This name should be unique in the current block
  • Type – control type. There are available several types such as Text, Select, Toggle, Image, etc…
  • Default value – default control value
  • Help text – help text will be added under control
  • Placement – control placement. Available placements and description read below on this page
  • Save in Meta – save control value in custom meta field. Read more info on this page below

Extra settings:

  • Placeholder – text control placeholder, will be visible when value is empty
  • Checked – default state for control types Checkbox and Toggle
  • Choices – options for control type Select. Read here¬†more info how to work with it

Control Placement

Control can be added in 2 places: Inspector and Content (inside block body). Example:

Custom Meta Field

Each control has possibility to save it’s value in the custom fields, so this value will be available in the post meta data and developers may get this value. For example:

You should add a unique custom field name, as 3rd-party plugins/themes may use the same name and it will be conflicted. For example, if you want to use this block in your theme “My Super Theme”, we recommend adding slug name – mst_control_meta_name.

Reserved Control Names

There are reserved control names that you shouldn’t use:

  • className – block custom classname
  • align – block align
  • anchor – block custom ID
  • blockId – block unique ID, generates automatically
Was this helpful to you?