Hi, I am after a background image transition from colour to B&W on my featured boxes. I know I can do it on an image but don't seem to be able to achieve the same result on a background image.
Add this into the Custom CSS box in your Salient Theme Options panel (We write all Custom CSS in the Live Browser to ensure accuracy. If you cannot see any changes, make sure there is no red cross in the Custom CSS Box as any syntax error would cause all CSS under that line of code to not show up on the Frontend):
Thanks so much...one last question (for now) can you use the text outline feature as used here on any other elements apart from the rolling header? I have tried multiple title options and can't find it.
You can use the CSS below to set the stroke on any text element.
Add this into the Custom CSS box in your Salient Theme Options panel (We write all Custom CSS in the Live Browser to ensure accuracy. If you cannot see any changes, make sure there is no red cross in the Custom CSS Box as any syntax error would cause all CSS under that line of code to not show up on the Frontend):
Hi, I am after a background image transition from colour to B&W on my featured boxes. I know I can do it on an image but don't seem to be able to achieve the same result on a background image.
Attached files: Screenshot 2023-01-24 at 10.18.46.png
Hey Again,
You can use the built-in "Image Filter" Feature in the media library:
Thanks
ThemeNectar Support Team
Hi, thanks, but how do I add a transition for a background image? also while I have got you...can you use the text outline feature on other elements?
Could you provide a test page where you want this transition to work, also what would trigger the transition?.
Thanks
ThemeNectar Support Team
Sure...http://keironc26.sg-host.com/ ideally the 3 images would go from colour to a greyscale version of them.
Hey Again,
Add this into the Custom CSS box in your Salient Theme Options panel (We write all Custom CSS in the Live Browser to ensure accuracy. If you cannot see any changes, make sure there is no red cross in the Custom CSS Box as any syntax error would cause all CSS under that line of code to not show up on the Frontend):
.wpb_column:hover > .vc_column-inner > .column-image-bg-wrap{ filter:grayscale(1); }Thanks
ThemeNectar Support Team
Thanks so much...one last question (for now) can you use the text outline feature as used here on any other elements apart from the rolling header? I have tried multiple title options and can't find it.
Hey Again,
You can use the CSS below to set the stroke on any text element.
Add this into the Custom CSS box in your Salient Theme Options panel (We write all Custom CSS in the Live Browser to ensure accuracy. If you cannot see any changes, make sure there is no red cross in the Custom CSS Box as any syntax error would cause all CSS under that line of code to not show up on the Frontend):
h2.vc_custom_heading { -webkit-text-stroke-color: inherit; -webkit-text-fill-color: rgba(0,0,0,0); -webkit-text-stroke-width:1px; }Thanks
ThemeNectar Support Team
Thanks! SORRY I have another question...the Mouse Indicator is it only available on posts? I'd love it over the hero video?
Hello again,
This feature is only available on some templates of the theme. It is currently not available for videos.
Kind regards,
Thanks Andrew, what templates is is available for?
Thanks Andrew, what templates is is available for?
Hello again,
To clarify, how would you want the mouse cursor to look after changing? Could you please share a screenshot of how you'd want it to look?
My apologies for the confusion.
Kind regards,
Hello again,
Thank you for getting back to us.
Adding this feature to other images would require some customization that is beyond our scope of support at this point.
I would recommend hiring a developer to assist you with this.
Kind regards,