Color field - multi reference field

Design help CMS
1

Hello! I have a question here for tha custom code wizards!

I’m working on a collection page. that collection page has a highlight color that came from the CMS color field. right? ok. But there’s a catch. There are a couple of reference fields on that collection and I also want them to catch the color from the cms color field.

how can I do this? please heeeeeelp

2

Add live URL (Or read-only link).
Sound like something you could solve easily by JS (But the code & selectors names ==> related to the case).

Or even by simple CSS custom code added to collection page (Add selector and set the color to “feild-color”).

<style>
.some-ref-card{
  color: {{color-webflow-cms-feild}}!important;
}
</style>
1 Like
3

Dear Ezra,

Thank you for your suggestion. I understand your logic but don’t understand what I need to put instead of “color-webflow-cms-feild”. My custom code section marks it red, ergo invalid. How do I make the system understand that they need to fetch the color hex code I set in that particular entry in the template’s corresponding CMS collection?

Would love your insights on this.

Best,
Joep

4

Just because I’ve been trying to work this out…

I’m using a CMS collection that has a colour choice for fonts. It has a multi reference field that I also want to use the same colour as selected in the parent collection…and you can’t bind the colour selection to a multi reference field in the normal way.

Ezra’s solution works fine on a collection page (place it inside your page’s head tag)

<style>
.TheClassNameYouWantColoured {
color: {{TheActualNameOfYourCollectionField-use-hyphens-for-any-spaces}}!important;
}
</style>

The name you type in as your field name will turn to a purple drop down menu…and you can choose any element from the parent collection to bind.

Hope that helps someone!