Hi,
I'm dealing with a problem on my website concerning background colour in the slideshow-addon.
In the backend everything looks perfect, but the frontend does't show background colour. When checking the sourcecode of the site, every color code for background colour is followed by "px", which reports to be invalid of course. The site is [https://biennalederzeichnung.de/], the problem started after upgrading to Joomla 4.2.9 and Joomshaper 4.0.8, which I'm currently using.
Thanks for addressing this issue, regards
Ulrich
Awaiting an answer
SP Page Builder
Lost background colour of text in slideshow
14 replies
Mehtaz Afsana Borsha Staff
Hi
Thanks for contacting us. Could you please give me a screenshot of your issue?
-Regards.
Galeriehaus Nord e.V. Asked this
Hi,
I do have screenshots, but couldn't find a way to post them here - the "insert image" button doesn't let me upload an image...
Mehtaz Afsana Borsha Staff
You can use this for uploading screenshot
Galeriehaus Nord e.V. Asked this
Thanks - I didn't know that I would need additional software ...
Here is how it should look like (like it does in the editor):
https://prnt.sc/5XhURy2hABj5
And this is the result for the visitor online:
https://prnt.sc/9yrXXSO9U6Nv
Mehtaz Afsana Borsha Staff
Use this custom CSS
.sppb-sp-slider-title{
background-color: white !important;
}
.sppb-sp-slider-text{
background-color: white !important;
}Path towards custom CSS: Extensions>Templates>Styles> Click on your current default template name then choose Template Options. Then find custom CSS within the custom code.
Galeriehaus Nord e.V. Asked this
Thank you for that suggestion.
But that doesn't solve my problem: if I use this code, EVERY title and text has a white background, but I need to define it for each item of the slideshow individually, as it seems to be possible in the "style" menu of the respective item.
Mehtaz Afsana Borsha Staff
Ok then you have use it manually
#sppb-addon-1613392516138 .sp-slider #sp-slider-item-1613392516138-num-0-key #sp-slider-inner-item-1613392516139-num-1-key{
background-color:white !important;
}
#sppb-addon-1613392516138 .sp-slider #sp-slider-item-1613392516138-num-0-key #sp-slider-inner-item-1613392516139-num-2-key{
background-color:white !important;
}
#sppb-addon-1613392516138 .sp-slider #sp-slider-item-1613392516138-num-1-key #sp-slider-inner-item-1613392516140-num-1-key{
background-color:white !important;
}
#sppb-addon-1613392516138 .sp-slider #sp-slider-item-1613392516138-num-1-key #sp-slider-inner-item-1613392516140-num-2-key{
background-color:white !important;
}
#sppb-addon-1613392516138 .sp-slider #sp-slider-item-1613392516138-num-2-key #sp-slider-inner-item-1613392516141-num-1-key{
background-color:white !important;
}
#sppb-addon-1613392516138 .sp-slider #sp-slider-item-1613392516138-num-2-key #sp-slider-inner-item-1613392516141-num-2-key{
background-color:white !important;
}
#sppb-addon-1613392516138 .sp-slider #sp-slider-item-1613392516138-num-9-key #sp-slider-inner-item-1613392516148-num-1-key{
background-color:white !important;
}
#sppb-addon-1613392516138 .sp-slider #sp-slider-item-1613392516138-num-9-key #sp-slider-inner-item-1613392516148-num-2-key{
background-color:white !important;
}
#sppb-addon-1613392516138 .sp-slider #sp-slider-item-1613392516138-num-3-key #sp-slider-inner-item-1613392516142-num-1-key{
background-color:white !important;
}
#sppb-addon-1613392516138 .sp-slider #sp-slider-item-1613392516138-num-3-key #sp-slider-inner-item-1613392516142-num-2-key{
background-color:white !important;
}
#sppb-addon-1613392516138 .sp-slider #sp-slider-item-1613392516138-num-4-key #sp-slider-inner-item-1613392516143-num-1-key{
background-color:white !important;
}
#sppb-addon-1613392516138 .sp-slider #sp-slider-item-1613392516138-num-4-key #sp-slider-inner-item-1613392516143-num-2-key{
background-color:white !important;
}
#sppb-addon-1613392516138 .sp-slider #sp-slider-item-1613392516138-num-5-key #sp-slider-inner-item-1613392516144-num-1-key{
background-color:white !important;
}
#sppb-addon-1613392516138 .sp-slider #sp-slider-item-1613392516138-num-5-key #sp-slider-inner-item-1613392516144-num-2-key{
background-color:white !important;
}
#sppb-addon-1613392516138 .sp-slider #sp-slider-item-1613392516138-num-6-key #sp-slider-inner-item-1613392516145-num-1-key{
background-color:white !important;
}
#sppb-addon-1613392516138 .sp-slider #sp-slider-item-1613392516138-num-6-key #sp-slider-inner-item-1613392516145-num-2-key{
background-color:white !important;
}
#sppb-addon-1613392516138 .sp-slider #sp-slider-item-1613392516138-num-7-key #sp-slider-inner-item-1613392516146-num-1-key{
background-color:white !important;
}
#sppb-addon-1613392516138 .sp-slider #sp-slider-item-1613392516138-num-7-key #sp-slider-inner-item-1613392516146-num-2-key{
background-color:white !important;
}
#sppb-addon-1613392516138 .sp-slider #sp-slider-item-1613392516138-num-8-key #sp-slider-inner-item-1613392516147-num-1-key{
background-color:white !important;
}
#sppb-addon-1613392516138 .sp-slider #sp-slider-item-1613392516138-num-8-key #sp-slider-inner-item-1613392516147-num-2-key{
background-color:white !important;
}
#sppb-addon-1613392516138 .sp-slider #sp-slider-item-1613392516138-num-10-key #sp-slider-inner-item-1613392516149-num-1-key{
background-color:white !important;
}
#sppb-addon-1613392516138 .sp-slider #sp-slider-item-1613392516138-num-10-key #sp-slider-inner-item-1613392516149-num-2-key{
background-color:white !important;
}
Galeriehaus Nord e.V. Asked this
Really? That's the only way to get back functionality that worked perfectly before the update? As I mentioned before, it worked with Joomshaper 3.x well, so it seems to be a problem of the new version...
The slideshow looks fine in the backend but saving the changes doesn't end up in correct code.
As you can see in the next screenshot
https://prnt.sc/cTw9V5alJ-hm
in the marked line, the color code for the background is "ffffffpx", where it shoud be "'ffffff" - why the software is adding that "px", I don't know, but that might be the problem, for that is an incorrect (and therefore ignored) value. Perhaps you could have a look at that. Thank you.
Mehtaz Afsana Borsha Staff
Ok I will inform our team. In the meanwhile if you want then you can use my code.
Galeriehaus Nord e.V. Asked this
Thank you. I'm looking forward to a (permanent) solution for that problem but I will try that workaround 'til then.
Mehtaz Afsana Borsha Staff
Sure thanks.
Galeriehaus Nord e.V. Asked this
I've now tried to use the code you've posted.
Though I wrote it to the custom.css file, it didn't make any difference: still no white in the background... did I overlook something?
Mehtaz Afsana Borsha Staff
Could you please give me your super admin access? I need to check.
Galeriehaus Nord e.V. Asked this
Today I found a new Page Builder Update (v4.0.10) in my dashboard. After installing that, it seems that everything is working fine now. I've cleared the custom.css and voila: the website looks the same in "real life" like in the editor. Thanks for adressing that problem in the update!
Log in to reply.