Hi @artf - what you've built is magnificent. It's been a gentle struggle as I'm far from being a JS wizard. However, I've got just about everything fully configured - except for this! I want to set traits that display when an image is selected (alt, src, id). I am sure it can be done once at initialisation, but I'm buggered if I can figure out how do do it. I've read everything I can find in the issues and am still stuck. The only way I got it to work is as follows ... Also - the out-of-the-box...

🐛 Fix: Traits — GrapesJS #3247

Answers (2)

artf• January 28, 2021

Hi Freddy, you can simply extend the image component in this case

editor.Components.addType('image', {
  model: {
   defaults: {
     traits: [{name: 'alt'}, {name: 'src'}, {name: 'id'}]
   }
  }
});

GJSBlock• May 17, 2026

Thanks for reporting this, @fmay. Great question about Question : Traits. The recommended approach with Components is to use the event-driven API. Start here: Check the GrapesJS documentation for your specific module Look for the on() event listener method Most operations can be achieved by listeni...

Paid Plugins That Match This Issue

Curated by issue keywords and label relevance to help you ship faster.

View all plugins

Loading paid plugin recommendations...

Free option

Check the open-source GrapesJS plugins on GitHub or run a quick search in our free catalog.

Browse free plugins →

Premium option

Premium plugins ship with support, regular updates, and production-ready features — save days of integration work.

Browse premium plugins →

Browse Plugin Categories

Jump directly to plugin category pages on the marketplace.

Presets Plugins Components Blocks Assets Commands I18n Layers Styles Storages RTE Newsletters Web pages Site builders

Traits

Question

Answers (2)

Related Questions and Answers

Cannot read properties of undefined (reading 'lastComponent')

Deleting a component without deleting its corresponding style, will adding new components later cause style conflicts?

Select options are not displaying - new anomaly

Text element not able to be selected twice after extended with events

Paid Plugins That Match This Issue

Related tutorials

How to Build a Production GrapesJS Editor: The Complete Walkthrough of Brief, Preset, Plugins, and Services

Big Updates: TinyMCE 8 and Placeholder 2.0 for GrapesJS

Find the Right GrapesJS Plugin in Seconds: Smarter Discovery Is Live

Browse Plugin Categories