Docs

[444media]

Is there a way, presumably through custom CSS(?), to have the text layers have a drop shadow behind them?

I have animated white text appearing over an image in my Slider Revolution abovemast slide and I think that a drop shadow behind it would help it stand out more. Client thinks it doesn’t stand out enough, and I don’t want to add an opaque layer over the background image, so I thought a black drop shadow behind the text would help it pop.

I know there’s a section for custom CSS in Slider Revolution, I just don’t know how to write it.

Thanks!

[Lely]

Hi There,

We can add class custom-rext-shadow on the text layer class field. Then add the following custom CSS:

.custom-rext-shadow {
    text-shadow: 2px 2px red;
}

Please feel free to customize the value. This guide might help:http://www.w3schools.com/cssref/css3_pr_text-shadow.asp

[444media]

Thank you for this. But I added the above code to the Custom CSS area of Revolution Slider for my slide and the text layers did not change. No shadow added. Did I do something wrong?

[Joao]

Hi there,

You should add the code on Appereance Customizer Custom CSS instead.

Hope it helps

Joao

[444media]

Just tried it there too, but no luck. Though, I am just trying to create a shadow behind the text layers (Caring. Comfortable. Compassion. etc) in my abovemast slider in Revolution Slider. I don’t want shadow behind the rest of the text on the site. Though I did add a shadow behind the Uber menu navigation text.

Thanks

[Christopher]

Hi there,

Would you mind providing us with login credentials so we can take a closer look? To do this, you can make a post with the following info:

– Link to your site
– WordPress Admin username / password

Don’t forget to select Set as private reply. This ensures your information is only visible to our staff.

Thanks.

[444media]

This reply has been marked as private.

[Christopher]

Hi there,

Upon checking your slider, it doesn’t have text layer. Please add text layer :

<div class="custom-rext-shadow">layer</div>

Thanks.

[444media]

Hi Christopher,

I’m confused then….don’t I have 4 text layers? See attached screen shot. The 4 text layers that each say: Caring, Compassion, Comfort and Affordable. Those are not text layers?

These, whatever they are, are what I am trying to add shadow to to help them standout on the page a bit better.

[Friech]

Hi There,

The credentials you provided above is not admin, so we could not view your slider configuration.

Did you already figure this out? I am seeing a shadow on your text now.

Other user might looking on how to do this, first you need to define your own class.

.text-shadow {
    text-shadow: 2px 2px red;
}

You can either place that on Customizer Custom CSS or on your slider Custom CSS.

And then apply that class to your text layer.

Hope it helps, Cheers!

[444media]

Yes…I figured it out in a way….I just made the text elsewhere and made them images, then uploaded the images as layers.

But this all does help for future reference! I also asked the question to someone in the facebook group who helped me; he gave me the same info you provided here…so might have been one of you guys.

So thank you very much! VERY happy with all the great support here! I wish I found X theme sooner 😉

[Paul R]

You’re welcome! 🙂

[Author]

Posts