How to edit a button if the button has an action (opening a modal window)?
You have to create a custom component for that button if it requires custom logic/behavior from what the original HTML does
Read full answer below βQuestion
I have a html template. the html template has a button. when you click on the button, an event occurs (opening a modal window). Is it possible to visually change the appearance of a button without firing an event? With allowScript: 0, I can edit the appearance of the button, but in this case, the event does not fire (opening a modal window). In case of allowScript: 1, an event is triggered (opening a modal window), but there is no way to edit the appearance of the button. There were ideas to switch between allowScript 0 and allowScript 1, but allowScript removes all js from the page.
Answers (2)
You have to create a custom component for that button if it requires custom logic/behavior from what the original HTML does
Thanks for reporting this, @sashapawlow726. Great suggestion about FEAT: how to edit a button if the button has an action (opening a modal window)?! While this specific feature isn't yet in the core API, there are several ways to achieve similar behavior. Using the event system: Alternative approac...
Related Questions and Answers
Continue research with similar issue discussions.
Issue #3208
Using GrapesJS Without NPM?
Hey there, Is it possible to use the web builder features on a normal hosting provider without npm? say apache or other solutions? Thank yo...
Issue #3162
Button switcher to editor.allowsCripts
Hello, @artf ! :) Maybe you can help with grapesjs. I have buttons which has own scripts(e.g. opening modal window by click). And if I set...
Issue #3312
Make side panel's width to 20%
What are you trying to add to GrapesJS? The side panel looks scrunched. Unless you've got a big desktop, I'd rather not have images from th...
Issue #3371
Generate pages numbers any idea?
Hi, guys I'm creating a doc generator through grapesjs, I'd like to insert page numbers like "Page 1 of 5" at the bottom of each page. My s...
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 an AI-Powered Page Builder with GrapesJS in 2026
What we learned building GJSDocs β from simple AI text generation to structured, context-aware visual editing
Tutorial
How Much Does It Cost to Build a SaaS Page Builder in 2026?
How much does it cost to build a SaaS page builder in 2026? Explore realistic development costs, timelines, features, and how using GrapesJS can reduce
Tutorial
PageKit: the GrapesJS application you'd have to build anyway
A source-available Next.js app around the open-source GrapesJS core β publishing, custom domains, leads, checkout and a plugin loader.
Browse Plugin Categories
Jump directly to plugin category pages on the marketplace.