# Config.json for a Mautic theme with custom blocks

**URL:** <https://forum.mautic.org/t/config-json-for-a-mautic-theme-with-custom-blocks/36515>\
**Category:** Development\
**Created:** [September 9, 2025, 9:51pm UTC](https://forum.mautic.org/t/config-json-for-a-mautic-theme-with-custom-blocks/36515 "2025-09-09T21:51:05Z")\
**Posts on this page:** 6\
**Page:** 1

<div class="post-metadata">

**Author:** ![honeypie](https://sea2.discourse-cdn.com/flex020/user_avatar/forum.mautic.org/honeypie/32/13968_2.png) [@honeypie](https://forum.mautic.org/u/honeypie)\
**Post date:** [September 9, 2025, 9:51pm UTC](https://forum.mautic.org/t/config-json-for-a-mautic-theme-with-custom-blocks/36515/1 "2025-09-09T21:51:05Z")

</div>

Is there a valid example for a complete config.json for a Mautic theme that supports custom blocks in the GrapesJS Email Builder? I have not been able to make new blocks appear or redefine existing blocks!

This I tried but did not work:

```auto
{
“name”: “xxxxxx”,
“description”: “Ein Theme mit benutzerdefinierten Blöcken für den GrapesJS Builder”,
“version”: “1.0.0”,
“builder”: \[“grapesjsbuilder”\],
“features”: \[“email”\],
“author”: “xxxxxxxx”,
“authorUrl”: “https://www.xxxxxxxx.eu”,
“emailbuilder”: {
“blocks”: {
“text”: {
“name”: “Text1”,
“description”: “Einfacher Textblock”,
“html”: “Hier ist ein Beispieltext.”
},
“button”: {
“name”: “Button1”,
“description”: “Vordefinierter Button”,
“html”: “Button Text”
},
“custom_block1”: {
“name”: “Benutzerdefinierter Block”,
“description”: “Ein Block mit eigenem Styling”,
“html”: “Benutzerdefinierter Inhalt hier”
}
}
}
}

```

---

<div class="post-metadata">

**Author:** ![silavapi](https://sea2.discourse-cdn.com/flex020/user_avatar/forum.mautic.org/silavapi/32/7424_2.png) [@silavapi](https://forum.mautic.org/u/silavapi)\
**Post date:** [September 10, 2025, 8:37am UTC](https://forum.mautic.org/t/config-json-for-a-mautic-theme-with-custom-blocks/36515/2 "2025-09-10T08:37:39Z")

</div>

Welcome @honeypie I’ve moved this over to #Development as I think you’re probably more likely to get a response there.

@Leon_Oltmanns I think your team has done some work with custom blocks in the builder, no?

---

<div class="post-metadata">

**Author:** ![honeypie](https://sea2.discourse-cdn.com/flex020/user_avatar/forum.mautic.org/honeypie/32/13968_2.png) [@honeypie](https://forum.mautic.org/u/honeypie)\
**Post date:** [September 10, 2025, 1:24pm UTC](https://forum.mautic.org/t/config-json-for-a-mautic-theme-with-custom-blocks/36515/3 "2025-09-10T13:24:10Z")

</div>

How is it possible to show here a config.json with html code. html was removed in my previous post!

---

<div class="post-metadata">

**Author:** ![silavapi](https://sea2.discourse-cdn.com/flex020/user_avatar/forum.mautic.org/silavapi/32/7424_2.png) [@silavapi](https://forum.mautic.org/u/silavapi)\
**Post date:** [September 10, 2025, 1:39pm UTC](https://forum.mautic.org/t/config-json-for-a-mautic-theme-with-custom-blocks/36515/4 "2025-09-10T13:39:15Z")

</div>

When you use the editor, there’s a \</\> icon on the editor. This puts all the selected content into a code block.

---

<div class="post-metadata">

**Author:** ![honeypie](https://sea2.discourse-cdn.com/flex020/user_avatar/forum.mautic.org/honeypie/32/13968_2.png) [@honeypie](https://forum.mautic.org/u/honeypie)\
**Post date:** [September 10, 2025, 2:00pm UTC](https://forum.mautic.org/t/config-json-for-a-mautic-theme-with-custom-blocks/36515/5 "2025-09-10T14:00:12Z")

</div>

Here is the code once more:

```auto
{
  "name": "Custom GrapesJS Theme",
  "description": "Theme with custom blocks for GrapesJS Email Builder",
  "version": "1.0.0",
  "author": "Your Name",
  "builder": ["grapesjsbuilder"],
  "features": ["email"],
  "emailbuilder": {
    "blocks": {
      "text": {
        "name": "Text",
        "description": "Simple text block",
        "html": "<div style=\"font-family: Arial, sans-serif; font-size: 14px; color: #333;\">Sample text</div>"
      },
      "button": {
        "name": "Button",
        "description": "Predefined button",
        "html": "<a href=\"#\" style=\"background-color: #1a73e8; color: white; padding: 10px 25px; border-radius: 6px; text-decoration: none; display: inline-block;\">Click me</a>"
      },
      "custom_block": {
        "name": "Custom Block",
        "description": "Block with custom HTML and styling",
        "html": "<div style=\"background-color:#f4f4f4; padding: 20px; border-radius: 8px; text-align: center; font-size: 16px;\">Custom design</div>"
      }
    }
  }
}

```

---

<div class="post-metadata">

**Author:** ![honeypie](https://sea2.discourse-cdn.com/flex020/user_avatar/forum.mautic.org/honeypie/32/13968_2.png) [@honeypie](https://forum.mautic.org/u/honeypie)\
**Post date:** [September 10, 2025, 9:04pm UTC](https://forum.mautic.org/t/config-json-for-a-mautic-theme-with-custom-blocks/36515/7 "2025-09-10T21:04:49Z")

</div>

In the web I found the information config.json is no longer used to define blocks. In the actual version of Mautic blocks are defined in file blocks.json. This file should be stored in the theme in the same directory as the config.json

I found two different examples of blocks.json:

```auto
{
  "text": {
    "label": "Text",
    "content": "<mj-text font-size=\"17px\">This is a paragraph.</mj-text>",
    "attributes": {
      "class": "fa fa-camera-retro"
    }
  },
  "button": {
    "label": "Button",
    "content": "<mj-button>Click me now</mj-button>",
    "attributes": {
      "class": "gjs-fonts gjs-f-button"
    }
  }
}

```

and a second one:

```auto
{
  "text": {
    "name": "Text",
    "category": "Basic",
    "html": "<div style=\"font-family: Arial, sans-serif; font-size: 14px; color: #333;\">Sample text</div>"
  },
  "button": {
    "name": "Button",
    "category": "Basic",
    "html": "<a href=\"#\" style=\"background-color:#007bff; color:#fff; padding:10px 20px; border-radius:5px; text-decoration:none; display:inline-block;\">Click me</a>"
  },
  "custom_block": {
    "name": "Custom Block",
    "category": "Custom",
    "html": "<div style=\"background-color:#f4f4f4; padding:20px; border-radius:8px; text-align:center; font-size:16px;\">Custom design</div>"
  }
}

```

Both versions don’t work for me. So I have the following questions:  
Is it possible to use a blocks.json in an email theme ?  
If yes - how should it look like ?

Tanks in advance