Setting Custom Color Palettes via Field Options

This topic has 10 replies, 3 voices, and was last updated 7 months, 2 weeks ago by JC.

Creator

Topic
December 10, 2020 at 5:00 AM #23503

Resolved David Newton
Participant

I've tried quite a few options for how to add custom palette colors via the Advanced tab of a Color Picker field, but none of them are working. It discusses how to set the color palettes here: https://docs.metabox.io/fields/color/. But, that's for coding it directly. Can I do the same through adding an option under the Advanced tab of the color picker?

Thanks!
Creator

Topic

Viewing 10 replies - 1 through 10 (of 10 total)

Author

Replies
December 10, 2020 at 6:34 AM #23504

Long Nguyen
Moderator

Hi David,

You can use the Dot notation to define an array in the Builder. See my screenshot https://share.getcloudapp.com/eDuwwOG0.

Or use the JSON notation (array) ["#459", "#78b", "#ccc"]. See https://share.getcloudapp.com/Wnullgw8.

December 10, 2020 at 10:38 PM #23510

David Newton
Participant

That works perfectly, thank you.

Is it possible to do the same with the Background field in some way?

December 11, 2020 at 12:08 PM #23514

Long Nguyen
Moderator

Hi,

The field background has not supported the setting palettes like the field color yet. I'm going to create a feature request for the developer team to support this.

Thank you.

December 31, 2021 at 8:35 PM #32949

JC
Participant

Hello Long,

could you please reupload the screenshots? They don't work any more.

Where do I enter the palette-values? Under "Color picker options" or under "Advanced / Custom settings"? Will the key be "js_options" or "palettes"?

Thanks.

December 31, 2021 at 8:50 PM #32950

Long Nguyen
Moderator

Hi,

The key is palettes in the Builder, here is the screenshot https://imgur.com/P6EfPVG

January 4, 2022 at 6:08 PM #32984

JC
Participant

Thank you, Long.

I entered the values as shown but the palette is not changing. Does it maybe not work with multiple color pickers in the same block/field group?

Best

Jan

January 4, 2022 at 9:47 PM #32990

Long Nguyen
Moderator

Hi Jan,

Can you please share the code that creates the field? And some screenshots of how it displays on your site?

January 4, 2022 at 10:38 PM #32993

JC
Participant

Hi Long,

here is a screenshot of the color picker I test on:

https://prnt.sc/25zmbla

I set like 12 colours in this group.

https://prnt.sc/25zmmls

And here I am looking for the color palette. The first three colours should be Red, Black, Red. But it is the same palette as in every other color picker.

https://prnt.sc/25zmrhx

And here is the group field export:

https://www.dropbox.com/s/qvyoqxmixw1sccm/stundenplan.json?dl=0

Thanks for your support.

Jan

January 5, 2022 at 12:34 PM #33004

Long Nguyen
Moderator

Hi,

I got it. In the builder, you should use the double quote instead of the single quote. Like this

["#f00","#000","#ccc"]

January 5, 2022 at 7:00 PM #33015

JC
Participant

That's it.

Thank you Long!
Author

Replies

Viewing 10 replies - 1 through 10 (of 10 total)

You must be logged in to reply to this topic.