Welcome! To use this support forum, please Login or Join Today!

   

Styling slide caption…

{name}
Rank

Total Posts: 2

Joined 2011-07-25

PM

 

How can I go about styling the slider captions so they look nice?

My site: http://www.laserplasticwelding.com

Example: http://demos.simplethemes.com/presstige/?style=style5

Note the font difference and also the height of the ribbon compared to the text…

Thanks!

-Josh

{name}
RankRankRankRank

Total Posts: 3667

Joined 2011-04-27

PM

 

The captions you’re referring to is actually an image
http://demos.simplethemes.com/presstige/wp-content/uploads/2011/05/presstige_slide_promo1.png

The slide captions look like this:
http://demos.simplethemes.com/presstige/demo-slideshow

It looks like you’ve added HTML in yours. I wouldn’t suggest this method.

You can change the caption height and text styles in the CSS:
Open style5.css (Appearance → Editor → style5.css)
Find the .slide_caption class and change to something like:

.slide_caption {
 text-shadow: #000 1px 1px 0;
 background:#000;
 background:rgba(0,0,0,.70);
 color:#fff;
 height: 60px;
 font-size: 30px;
}

Then, if you want to hide the caption title, you could add below that ^:

.slide_caption span.title {
 text-indent: -9999em;
 display: inline-block;
}

(Note: each slideshow is given a unique div#id so if you wanted to have multiple styles for various sliders, you could.)