Taxonomy color gradient

[robertblaj]

Hello,
I would like to overlay a circle onto every featured image of a post, with the background of the circle defined as a linear-gradient specific to each taxonomy. For now I have only managed to associate solid colors to the corresponding taxonomy using ACF pro color picker and the dynamic content in cornerstone. I tried using the same shortcode ({{dc:acf:post_field field=“color_category”}}) in the global CSS to define the first color of the linear gradient but the output is invalid. I was thinking i could pull this off by having 2 color pickers assigned to a taxonomy and then insert them in the global css somehow. Do you have any suggestions for me?

[ruenel]

Hello @robertblaj,

You may use {{dc:term:meta key="color"}} assuming you have used the Looper Provider Current Terms or trying to output the colors in an archive page.

Hope this makes sense.

[robertblaj]

Hello, thank you for your answer. The color picker is defined as a field group not as a term, so I used this {{dc:post:meta key=“culoare_categorie”}} in the global CSS section and it doesn’t work. When i use it in the background color input, in the cornerstone panel, it works. This means that the shortcode is correct but for some reason it is incorrectly interpreted by the global css. I need to use the global css to define the gradient because there is no option to define them in cornerstone.

The browser outputs invalid property value:

What i’m trying to achieve looks like this:

Hope I was clear. Thanks

[christian]

Hey @robertblaj,

That happens if you have an error in your CSS. Please first correct your CSS in the Global CSS before adding the Dynamic Content. That means you first make sure the plain CSS works first.

Once it’s proven that adding the DC causes the error, please provide the following in a Secure Note.

• WordPress Login URL
• Admin username and password

You can find the Secure Note button at the bottom of your posts.

Thanks.

[robertblaj]

Hello,
I’ve sent the credentials in the above post.
Thank you

[ruenel]

Hello @robertblaj,

You have this:

which means that this:

{{dc:post:meta key=“culoare_categorie”}} or {{dc:acf:post_field field=“culoare_categorie”}} will only work on single posts. It will not work on other pages. It is also best that you add the CSS in your custom single layout or at least use specific post page CSS code like:

.single-post .overlay-featured {
    /* your styling */
}

Be advised that custom coding is beyond the scope of our support under our Support Policy. If you are unfamiliar with code and resolving potential conflicts, you may select our One service for further assistance.

Best Regards.