Hi there,
OUTLINE: I want to dynamically set the background colour of a text layer/div in Slider Revolution based on the colour a user pics on the post
I have a div using Text Layer in Slider Revolution (SR).
The background of this div needs to change according to the background colour in ACF field by user (event_background_color) set in the Custom Post Type.
In SR I have the text layer content with this code:
<div class="primary-background"></div>
and in WordPress Customise – Additional CSS I have:
.primary-background {
background-color: <?php the_field('event_main_color'); ?>;
}
However, the obvious issue with the above is that php is not parsed by css.
I have also tried;
<div style="background-color:{{meta:event_main_color}}" class="primary-background"></div>
But to no avail.
If someone could point me in the right direction it would be very much appreciated!
Looking at this
<div style="background-color:{{meta:event_main_color}}" class="primary-background"></div>
is this in reference to doing this https://www.sliderrevolution.com/faq/how-add-custom-post-meta-your-post-based-sliders/
@hube2 Yes it is.
Is it possible to pass hex value from ACF on a custom post to the CSS or inline CSS of Revolution Slider layer content?
I can print the different hex code value out using ACF shortcode on each slide but can’t seem to figure out how to apply the hex to background css and shape/box layer so it’s different on each slide.
Thanks
I don’t really know much about rev slider. From what I can see in that article it looks like what you’re doing with the div should work.
<div style="background-color:{{meta:event_main_color}}" class="primary-background"></div>
What is the class primary-background doing?
Is the div being output properly with the css style?
When you inspect the page is the background color being applied or is it overridden by something else?
