Shortcode + Gutenberg

If you already have shortcodes and want to make it compatible with Gutenberg, you can easily make it possible.

Lazy Block Edit

First, you need to add block Name, Slug, Icon, Category, Description, and Keywords. Then you can start adding Controls:

  • Textarea control named Content will be used as shortcode content [my_shortcode]Content[/my_shortcode]
  • Attribute control you can add as many as you want. You can also name it as you need, “Attribute 1” and “Attribute 2” for example only

Frontent HTML code:

Output HTML:

Was this helpful to you?
Yes No