Issue #1116Opened May 15, 2018by perfect-coders0 reactions
outdated

Property gradient is not working

Question

Hi @artf. I have used the GrapesJS Style Gradient plugin and do the same as it is suggested. But it is not making the gradient in the settings. I am giving like that

Code SnippetTEXT
{
      name: 'Gradient',
      property: 'background-image',
      type: 'gradient',
      defaults: 'none'
    }


Also When I added the "artf/grapesjs-style-gradient" plugin through grapes method like this
plugins: [ 'gjs-style-gradient'], 
pluginsOpts: {
                'gjs-style-gradient': {
                      colorPicker: 'default',
                      grapickOpts: {
                                      min: 1,
                                      max: 99,
                                  }    
                },                

It is showing the error :- Plugin gjs-style-gradient not found

Answers (3)

artf• May 18, 20180 reactions

Plugin gjs-style-gradient not found

Are you sure you've imported it correctly?

perfect-coders• May 18, 20180 reactions

This is how the gradient property is coming.

screenshot from 2018-05-18 19 22 10

And this is how I am doing /* Page Settings */ { name : 'Page Settings', open : true, buildProps : ['background-color','background','background-repeat','background-size','background-position', 'background-attachment'], properties : [ { name: 'Gradient', property: 'background-image', type: 'gradient', defaults: 'none' }, { property : 'background-color', name: 'Background Color', }, { property : 'background', name: 'Background Image', }, { property : 'background-size', name: 'Sizing', }, { property : 'background-position', name: 'Alignment', }, { property : 'background-repeat', name: 'Repeat', }, { property : 'background-attachment', name: 'Attachment', }, ] },

please see this fiddle https://jsfiddle.net/3h7bthy3/#&togetherjs=GH3IytSyog

artf• May 23, 20180 reactions

Your fiddle doesn't work (you didn't setup it correctly), btw this is the demo, it uses the latest version and it works as expected

Related Questions and Answers

Continue research with similar issue discussions.

Issue #1753

[Bug/Question] StyleManager - SectorsView - addToCollection() uses "name" attribute to build the ID and fails with several spaces or special characters

Hi @artf , Using the pluginOpts property from the grapesjs.init() method, I customized the sectors displayed on the Style Manager (through...

3 answersUpdated January 27, 2020

Issue #1232

How to change the margin from px to rem

Hi @artf, Hope you are doing fine. I have changed the margin settings from "px" to "rem" in one of the element using below code: { property...

2 answersUpdated September 17, 2019

Issue #1296

Custom Rich Text Editor is not working

Hi @artf, I've just created a custom plugin of the RTE using different libraries like CKEditor 5, TinyMCE 4 or pell but all of them with th...

3 answersUpdated February 18, 2020

Issue #916

[Question] why do layers not have element tag name?

I'm playing around with grapes' internals because I would like to contribute in the future. Most of my interest is in making it worth with...

3 answersUpdated December 17, 2019

Paid Plugins That Match This Issue

Curated by issue keywords and label relevance to help you ship faster.

View all plugins

Loading paid plugin recommendations...

Browse Plugin Categories

Jump directly to plugin category pages on the marketplace.

PresetsPluginsComponentsBlocksAssetsCommandsI18nLayersStylesStoragesRTENewslettersWeb pagesSite builders