Adding new button in toolbar
@lauragadea probably you should try to extend default component types (eg. default, image, text, etc.)
Read full answer below ↓Question
Hello,
I am trying to add a new button to the toolbar of all the components. I been able to add for each component separatly, but not for all of them at once. To note that I want to avoide modifying the file ‘src/grapesjs/dom_components/model/Component.js’
Is there a way to do that?
Thank you in advance for yur help!
Answers (3)
@lauragadea probably you should try to extend default component types (eg. default, image, text, etc.)
@lauragadea , please check #266
Yes @JulyanoF , I already have. And it suggests modifying the files ‘src/grapesjs/dom_components/model/Component.js’. That is exactly what I am trying to avoid.
Related Questions and Answers
Continue research with similar issue discussions.
Issue #510
Add new class programatically
Hello Artf, I want to edit the styles of components (mostly imported html) without modifying all components with the same class. I tried to...
Issue #913
[Question] Using Style tag instead of css
Hi, I've been taking a look inside of the dom_components, but cant seem to figure out how to manually override the styling aspect. I need a...
Issue #1113
[QUESTIONS] New trait type is not working with rendered components?
Hello, thanks for the great framework. I'm trying to apply this to my project. I want to add a new trait for existing LINK '<a>' component....
Issue #3608
FEAT: Disable Dragging
What are you trying to add to GrapesJS? I have implemented an alternative text editing component (not based on RTE). I want people to be ab...
Paid Plugins That Match This Issue
Curated by issue keywords and label relevance to help you ship faster.
Loading paid plugin recommendations...
Check the open-source GrapesJS plugins on GitHub or run a quick search in our free catalog.
Browse free plugins →Premium plugins ship with support, regular updates, and production-ready features — save days of integration work.
Browse premium plugins →Related tutorials
In-depth guides on the same topic.
Tutorial
How to Build a Production GrapesJS Editor: The Complete Walkthrough of Brief, Preset, Plugins, and Services
A complete walkthrough of building a production GrapesJS editor: how to choose a preset, pick plugins, and scope setup services without burning a sprint.
Tutorial
Embed GrapesJS in Your SaaS: A Weekend Guide
Embed GrapesJS in your SaaS and ship a white-label page builder over a weekend. Honest tradeoffs, real code, and the plugins that close the UX gap.
Tutorial
GrapesJS vs Webflow vs Builder.io vs Puck: Which Visual Builder to Choose in 2026
A practitioner's 2026 comparison of GrapesJS, Webflow, Builder.io, and Puck — pricing, AI features, lock-in, and a one-line rule for picking the right one
Browse Plugin Categories
Jump directly to plugin category pages on the marketplace.