Welcome to the support center for

Fancy Product Designer & Multistep Product Configurator


Disable colorpalette

is there a way to disable the colorpalet as shown below in the picture ?


I have the plus version installed and don't want to use it because some colors from othe product show up here.

The second line of colors are from another product.

Thx in advance.


The second line of colors is from another product? That should not be possible, are you sure?

It should be possible to hide it with some custom CSS:

.fpd-element-toolbar{ display: none ! important;}

custom CSS is added via the UI & Layout Composer, custom CSS tab.

This will also hide the toolbar for text, I can't currently think of a way to do this only for an image layer.

Well if i know where the problem is of the second line of colors i dont need to hide it.

Any suggestions ?

It's quite certainly impossible that any color there comes from another product, are you sure about that? If so - please open a ticket we'd need to take a closer look at it.

It is perfectly normal for the color selector to still show up even when fpd plus is used for color selection. If you want it gone and you don't need the toolbar for text then use the custom CSS. Otherwise you could make a feature request over in the feature request forum with a suggestion to hide the second selector if fpd plus is used.

Here is my solution. 

I use FPD Plus Color Selection and don't want the Product Designer Color Selection.

But i want Color Titles to be shown as Tooltips in the FPD Plus Color Selection.

So first i disable the first view, first layer (which is my color layer). Then I add Tooltip titles to the Colors and Update the Tooltip Framework.

I hope somebody finds this useful.

jQuery( document ).ready( function( $ ) {

 // FPD fixes after init

 $selector.on('productCreate', function(evt, viewInstance) {

  // lock layer for fist view, first layer

  fancyProductDesigner.getElements(0)[0].evented = false;


  // Add color names to color selection items

  var $colors = $(fancyProductDesigner.mainOptions.colorSelectionPlacement);

  $colors.children().each(function() {

   var hex = $(this).children().first().text();

   var tooltipTitle = fancyProductDesigner.mainOptions.hexNames[ hex.replace('#', '') ];

   tooltipTitle = tooltipTitle ? tooltipTitle : hex;




  // Activate the Tooltips

  FPDUtil.updateTooltip( $colors );


Login or Signup to post a comment