Hi Sam,
The text in text slides originally is white. However, on pages WordPress sometimes influences the text color and sets it to, for instance, black. Therefore, if you have a white background, text slides will appear empty in the widget and filled in a post or page.
You can get around this by setting the style of the slideshow to custom and editing the following CSS lines:
.slideshow_container h2 {
margin: 5px;
font-size: 25px;
color: #000; /* Add this have black titles */
}
.slideshow_container p {
margin: 7px;
font-size: 15px;
color: #000; /* Add this have black descriptions */
}
Version 2.2.0 will let you pick different text colors for every text slide.
Best regards,
Stefan
Thread Starter
Sam-30
(@sam-30)
Hi Stefan,
In the admin of my theme I can put extra ccs and that overwright the other. But when I put the css for the slideshow in, it don’t work,
nothing change.
It works for changing lay out Gravity forms also.
Do I have to put it somewhere else?
Cheers,
Sam
Hi Sam,
I meant for you to place the CSS into the custom style editor of the specific slideshow. If you set the style settings to ‘custom’, this editor should appear.
Best regards,
Stefan
Hi guys,
I followed the above instructions and changed the CSS, but the text is still not appearing? The CSS fixed the Titles and Descriptions only. I changed the slide’s background and still no text, am I missing something?
Here is the URL:
http://alexandracollege.eu/digitalscreen/2012/11/15/text-slideshow/
Thanks for your help in advance?
Hi,
I’m sorry for my late response.
When I go to your website, I see text on the text slides. Were you able to resolve your issue?
Best regards,
Stefan
The solution above worked for me but required a small tweak. My theme’s css applied a style to the H2 element that was over-riding the slideshow’s style. The theme style looked like this:
#content h2 { color:#000; }
In order to get around it I had to add the “#content” selector to the slideshow declaration like this:
#content .slideshow_container h2 {
margin: 5px;
font-size: 25px;
color:#fff;
}
#content .slideshow_container p {
margin: 7px;
font-size: 15px;
color:#fff;
}
This gave the new declaration the “precedence” it needed to be picked up. The reason it wasn’t picked up before seems to be that ID declarations (“#”) in CSS take priority over class declarations (“.”).
NOTE: this fix is NOT NECESSARY if your theme doesn’t have the “content” element and a matching declaration for h2. But, this does give you another avenue to trouble shoot.
