More control over panel buttons, dynamic panel buttons
Thank you for a very quick response, didn't know about the label property as it doesn't seem to be mentioned in the docs.
Read full answer below ↓Question
Hi, I am trying to implement several more dynamic buttons for the panel, for example a save button that depending on some flag will show an animated loading spinner, save icon or "Saved" text. In order to achieve that I need to be able to dynamically set the content, potentially size and also use not only icons but also text. I am wondering if there is a better way than either removing the button and adding it back (I guess the order of the buttons would change and I would actually need to be adding and removing a whole set of them to keep the ordering same) or using DOM manipulation to chang...
Answers (2)
Thank you for a very quick response, didn't know about the label property as it doesn't seem to be mentioned in the docs.
Well you can change the attribute and the content in this way
const prevBtn = editor.Panels.getButton('options', 'preview');
prevBtn.set({
attributes: {title: 'New title'},
label: 'New content'
})
for anything else more specific you can go with direct DOM manipulation
Related Questions and Answers
Continue research with similar issue discussions.
Issue #2852
[QUESTION]: Can't enable 2 panel buttons at the same time
Hi, I'm trying to enable more than one custom panel button at the same time. I think when I create some custom panel button (using code bel...
Issue #3213
How to save the dynamically added traits
Hi, @artf, I have a custom component that has a button trait. When the button is pressed, I am adding a custom trait dynamically using comp...
Issue #1787
[Question] Change HTML of Panel buttons from span to button
I have created some Panels and would like to change the element of panel buttons from span to button as its more appropriate and looks bett...
Issue #1179
[Question] Cannot load styles saved as !important
Hi! I'm trying to make all the user-set styles have the "!important" flag, in order to prevent some other previous existent classes to over...
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 →Browse Plugin Categories
Jump directly to plugin category pages on the marketplace.