Slideshow Preheading & Subheading color changes

GregJones
New Member
3 0 0

Hello, I would like to change the color of my preheading and subheading text on specific slides. Technically, I'd like to have a dark subheading color and a light subheading color. I was already able to change the Main color by adding HTML span tag to the slider itself but the preheading and subheading don't allow for HTML code.

 

https://gk5r0bw2vs3yvvic-26014613590.shopifypreview.com

Third slide is the slide in question, but as mentioned it would be great if I can set up a span class that would allow to change the colors as I upload banners.

 

Thank you in advance

0 Likes
Natztech
Excursionist
76 8 10

do you want to look like this 

Screenshot (33).png

then insert this code   Asset->/theme.css ->paste below code at the bottom of the file.

 .caption-content .pretext > p {color:#ced2de;}

 

Want to theme customize Hire us.
If helpful then please Like and Accept Solution
E-mail :natztech2312@gmail.com
0 Likes
GregJones
New Member
3 0 0

yes I do, but will that code change the rest of the slides as well? 

This is my current code for the slider. 

.custom-color-1 {
  color:#f01b1b;
}
.primary-color-pink {
  color:#f9b0b2;
}
.primary-color-blue {
  color:#93d4d1;
}
.pretext {
  color:#222529 !important;
}
.subtitle {
  color:#222529 !important;
}
a.highlight-false, input[type="button"].highlight-false, a.highlight-true, input[type="button"].highlight-true, a.continue-button {
    background-color: #252525;
    color: #ffffff;
    border: 1px solid #ffffff;
    transition: background-color 0.2s linear, color 0.2s linear;
    margin: 25px 0;
    font-weight: 700;
}
a.highlight-false, input[type="button"].highlight-false, a.highlight-true, input[type="button"].highlight-true, a.continue-button {
    background-color: #252525;
    color: #ffffff;
    border: 1px solid #ffffff;
    transition: background-color 0.2s linear, color 0.2s linear;
    margin: 25px 0;
    font-weight: 700;
}
a.highlight-false:hover, input[type="button"].highlight-false:hover, a.highlight-true:hover, input[type="button"].highlight-true:hover, a.continue-button:hover {
    background-color: #a4a4a4;
    border-color: #ffffff;
    color: #333;
}

 

0 Likes