• 0

Editing Type Style in RevSlider


Question

Posted · Report post

Is there a way to change the type style for the headlines in the Revslider?

I would like to remove the box around the type and just go with dark grey type.

 

 

Share this post


Link to post
Share on other sites

7 answers to this question

  • 0

Posted · Report post

That's right. The easiest way to identify the correct code that needs modification is to use the developer tools in Chrome or an extension like Firebug (see http://docs.pagelines.com/customize/overriding-default-css for a little bit explanation).

 

So for your original example, where you're looking to change the revslider text styling - when I inspect that element in developer tools in Chrome, I see http://d.pr/i/Moyn which shows me that  .revslider-container .slider-content h2 .slider-text is what is controlling that particular font styling. It's the background, the box-shadow and the font color that would need to be changed in order to achieve your look of just having a dark grey type. So this is what you'll want to put in your custom code area:

 

.revslider-container .slider-content h2 .slider-text {background: none; box-shadow: none; color: #333333;}

 

There's a lot more you can do with CSS of course! This is the best place to get going - http://www.w3schools.com/css/default.asp.

Share this post


Link to post
Share on other sites
  • 0

Posted · Report post

Hi novsun - You could create a custom styling class and add that into the section area or you could modify the CSS that controls that text:

 

.revslider-container .slider-content h2 .slider-text

 

You'll want to remove the background and box shadow and change the color to your liking as well.

Share this post


Link to post
Share on other sites
  • 0

Posted · Report post

Jake,

 

Thanks for the reply.

 

I'm not very skilled with adding new css classes. is that difficult?

 

Im more familiar with editing an existing css class, should be fine, I'm not sure where else it would matter to have box shadow for contrast.

 

Thanks,

Andy 

Share this post


Link to post
Share on other sites
  • 0

Posted · Report post

Hey Andy - Adding new classes is very easy actually, check out this how-to and you'll see what I mean. http://docs.pagelines.com/tutorials/section-area-styling.

 

That said, altering the class I suggested will only change the box shadow, etc on the revslider so don't worry about figuring out if you'd like those elements to remain on other parts of your site.

Share this post


Link to post
Share on other sites
  • 0

Posted · Report post

Great, thank you!

 

Where do I find the file I am editing? is it style.less inside the rev folder? via ftp or is there something within the editor?

 

Normally the css is edited by editing the theme but obviously that takes me into the dms...

 

Andy

Share this post


Link to post
Share on other sites
  • 0

Posted · Report post

Hey Andy - If you're not using a child theme (which I don't believe you are) your CSS changes and additions would go into the Custom Code section in the DMS visual editor http://d.pr/i/CVtI.

Share this post


Link to post
Share on other sites
  • 0

Posted · Report post

just copy and pasted from the original css and edited? othewise how would I know the names etc.. right?

 

Andy

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!


Register a new account

Sign in

Already have an account? Sign in here.


Sign In Now