Changes To The Slideshow - Question | JoomShaper

Changes To The Slideshow

D

Dominik

SP Page Builder 7 months ago

Hi there

I would like to make some changes to the slideshow. I was able to make a few changes myself using CSS, but I can't get any further with others.

  1. i don't want the title in the middle of the image, but further up. I would also like to change the font to Century Gothic (I tried using CSS, but unfortunately it doesn't work - I'm probably trying in the wrong place)

  2. i don't want to have a mouseover effect on the arrows of the slideshow. How can I delete this?

  3. i want to delete the gap between the thumbnails. The thumbnails should be directly next to each other.

https://prnt.sc/XKB4WjVTFViS

Thank you! Domi

0
6 Answers
Mehtaz Afsana Borsha
Mehtaz Afsana Borsha
Accepted Answer
Support Agent 7 months ago #187701

Hi

Thanks for contacting us.

1: You can use this CSS in your custom.css file

.sp-slider-content-align-center, .sp-slider-image-align-center h2{
  position: relative;
  bottom: 90px;
}

#sppb-addon-1740475070060 .sp-slider #sp-slider-item-1740475070060-num-0-key #sp-slider-inner-item-1740475070061-num-0-key {
    font-family: 'Century_Gothic' !important;
}

2: For this use this CSS in your custom.css file

div.sp-slider .sp-nav-control .nav-control:hover{
  background: unset !important;
}

3: For thumbnail use this CSS in your custom.css file

.sp-slider .sp-dots ul li{
  margin: 0 !important;
}

-Regards.

0
Mehtaz Afsana Borsha
Mehtaz Afsana Borsha
Accepted Answer
Support Agent 7 months ago #187842

Thanks for accepting the answer.

0
D
Dominik
Accepted Answer
7 months ago #187712

Thank you very much Mehtaz

But this code:

#sppb-addon-1740475070060 .sp-slider #sp-slider-item-1740475070060-num-0-key #sp-slider-inner-item-1740475070061-num-0-key {
    font-family: 'Century_Gothic' !important;
}

is only for one item. But I need it for all items.

Thank you! Domi

0
Ziaul Kabir
Ziaul Kabir
Accepted Answer
Support Agent 7 months ago #187798

Hello,

Please, try to use this css:

div#sppb-sp-slider-1740475070060 .sp-slider-outer-stage .sp-item .sppb-sp-slider-title {
    font-family: 'Century_Gothic' !important;
}

Thanks

0
D
Dominik
Accepted Answer
7 months ago #187800

That works great!! Thank you very much Kabir!

0
Ziaul Kabir
Ziaul Kabir
Accepted Answer
Support Agent 7 months ago #187803

You are welcome. We greatly value your opinion and would love to hear your feedback about SP Page Builder. If you could spare a moment, it would mean a lot to us!

You can share your review here:

Joomla Extensions Directory

Trustpilot

0