[QUESTION] Why stylable and unstylable props not working?
Question
First of all, excellent project! I love it! Very complete all-around. I've been reading and re-reading the doc and it is a steep learning curve.
Anyway, I would like to serve a template to the user with restrictions in styling. I have been trying to use stylable and unstylable props like this:
<h1 data-gjs-unstylable={["float"]}>Title</h1>
But yet the float style shows in the style manager. Why?
Is there any other way to customize the style manager based on the component? For example, if #site-logo is selected, the style manager shows the asset uploader and a text field (fallback).
Answers (3)
Hi there! for your first problem: i think this property must be specified on your component type definition. for your case it would be something like this:
editor.DomComponents.addType('my-h1',{
isComponent:(el) => {
if(el.tagName === 'H1'){
return true
}
},
model:{
defaults:{
tagName:'h1',
unstylable:['float'],
}
}
})
for your second problem, see if this can help you out. cheers.
I see! Thanks man! I will give it a go. :)
@ColdTuna
You wrote the attribute incorrectly, it should be
<h1 data-gjs-unstylable="[\"float\"]">Title</h1>
Related Questions and Answers
Continue research with similar issue discussions.
Issue #3287
QUESTION: Wrapper styling
First of all, congrats @artf for this amazing project 💯 I am currently working on a project and I wanted to ask if I can edit the wrapper...
Issue #1789
[Question] How to append a plus icon in the column and element section?
Hi @artf . First of all, great work. I have been trying to use grapesjs for a month now. So, I stumbled upon a situation where I need to le...
Issue #2065
Few Questions
First of all, Amazing project thumbs up to everybody involved. I have a couple of questions:How can I iterate over all of the components an...
Issue #2917
BUG: Style Manage does not hide style blocks
Hey @artf, I'm trying to hide style properties based on the selected element. for example, when I drag and drop an image on my GrapesJS, I...
Paid Plugins That Match This Issue
Curated by issue keywords and label relevance to help you ship faster.
Loading paid plugin recommendations...
Browse Plugin Categories
Jump directly to plugin category pages on the marketplace.