• Priority: 0
  • Status: Closed
  • Theme: Alysum
  • Assigned To: Marek
  • Private: No
  • Open Date: 23.06.17, 12:40
  • Opened by: leo
  • Closed by: Marek
  • Closed on: 08.09.17, 14:42
  • Reason: Closed
  • Comment: Glad to help!

Ticket #10486 - Change font color of title of showcase Slider

Hi,

I want to replace the sliders in the showcase slider

At this moment these have a light background color so the black font of the title and the caption is fine.

For next season I have new sliders with a dark background and therefore need a white font for these both sections.

So how can I do that ?

Kind regards,

Leo

Comments

Marek 23 Jun 2017, 20:20

You can change the title color using following css:

#white_bg .nivo-capt h3.main_color {color:#YOUR_COLOR}

and for normal text:

#white_bg .nivo-capt span {color:#YOUR_COLOR}
leo 18 Aug 2017, 09:56

Hi Marek,

Sorry for my late reaction but I’m just back from my holiday.

Where do I add this code ? In the general CSS, but then I suppose this has effect on all sliders and is not what I want, or in the text fields of the slider itself ?

If so than I do something wrong because after I’ve added #white_bg .nivo-capt h3.main_color {color:#ffffff} I only see this code in the slider.

Kind regards,

Leo

Marek 18 Aug 2017, 18:27

Sorry, I misread your first question.
Try following code for different slides:
First slide:

#white_bg .nivoSlider > li:nth-child(1) .nivo-capt h3.main_color {color:#YOUR_COLOR}

Second slide:

#white_bg .nivoSlider > li:nth-child(2) .nivo-capt h3.main_color {color:#YOUR_COLOR}
leo 21 Aug 2017, 09:28

Hi,

I’ve added the code below to the custom css but still the color of the fonts at the first slider are black ? See the attached screendump.

#white_bg .nivoSlider > li:nth-child(1) .nivo-capt h3.main_color {color:#ffffff}

Marek 21 Aug 2017, 10:20

There is also another way, try this:

#white_bg .nivoSlider > li:first-child .nivo-capt h3.main_color {color:#ffffff}
leo 05 Sep 2017, 23:44

Hi Marek, your last sugestion is also not working. Would you reopen this ticket and pleae find a working solution for this. Because otherwise we only can use light sliders/

Kind regards,

Leo

Marek 08 Sep 2017, 11:34

Could you please enable that slide where I need to fix the color

leo 08 Sep 2017, 12:46

Hi Marek,

I’ve added a slider which you may use for test.

See attachemnt.

Marek 08 Sep 2017, 12:58

you have enabled CSS compress in the Performance page in your back office. Please disable it.

leo 08 Sep 2017, 13:18

It is now disabled.

leo 08 Sep 2017, 14:07

Unfortunately it is still not working

Marek 08 Sep 2017, 14:19

Here is final code which works (for only 4th slide)

#white_bg #aw_slider > li:nth-child(4) .aw_slide-text * {color:#ffffff}
leo 08 Sep 2017, 14:38

Hi Marek,

Great, it works now !

Thank you very much for yout patience and support.

Kind regards,

Leo

Marek 08 Sep 2017, 14:42

No problem :)