Background Image inline
Hi @awaredigital StyleManager targets both Components and CssRules, so do it like below: Cheers!
Read full answer below ↓Question
Hi, Reading through the documentation, I can't find anywhere that explains what I'm looking to do. Currently, Grapes grabs the background image and puts it into the style, but I want to take this image and not add it to a background style, I want to put it into a data-element on the element that is selected. I've been looking at: editor.on('component:styleUpdate', function(e, i){}); But inside of this, I can't find the correct attributes I need to target to trigger the change it also doesn't seem to update when new items have been added to the canvas. I could be wrong, but I'm going around in...
Answers (3)
Hi @awaredigital StyleManager targets both Components and CssRules, so do it like below: Cheers!
That is great. How do i stop the data of
model.getStyle()['background-image']
being passed into the CSS? Only the background image.
Thanks
@awaredigital i have tested the above code and it was working fine. but for the error, you may check `bg` before further processing because after we update the component style we may get the callback again which is your case here: Cheers!
Related Questions and Answers
Continue research with similar issue discussions.
Issue #3123
FEAT: Add 'inline-flex' to display selector in Style Manager
What are you trying to add to GrapesJS? Display style inline-flex. Description: Currently the display selector of the Style Manager has onl...
Issue #3252
Does getHtml() remove the inline style property?
I was fiddling with ways that you could change the style of elements inside the canvas and i noticed that by using the color-picker trait t...
Issue #3216
FEAT: Add referrerPolicy to image loading through asset manager
What are you trying to add to GrapesJS? I'm trying to add the Referer header to image loading through asset manager. Describe your feature...
Issue #3218
How to add new HTML element with inline styles?
I would like to add a new HTML element, with inline styles, around the rte.selection(). With the following example, the HTML is OK, but pro...
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.