Slider – Caption

[richardcech]

Hello,
is it possible to have a caption under each slider and centered on the width of each slider?
like here: http://www.joosmathys.ch/aktuell

Best Regards
Richard Cech

[SeaTheme]

Hi,

It is possible by the custom CSS for some layout, but it not perfect, It will crop the part of the bottom of the image. There would be an aligned problem also.

Please leave your sider page URL, I will check if it is possible by your slider layout.

Regards!

SeaTheme – SeaTheme.net – Twitter – Facebook

[richardcech]

Hello,
my webpage is richardcech.com

I set it up via css by myself, so that the image has a white band at the bottom and text is over it. However, this solution causes problems with the phone and other resolutions. So I’d like to try your cropping option to see if it’s better.

Best Regards
Richard

[SeaTheme]

Hi,

Please add the custom CSS:

.module-id-1596385857332 .slide-item-des { 
    bottom: -30px;
}

Best

[richardcech]

Hello,

Your solution is basically the same as my previous one. The problem is that the text cannot be moved outside the image boundaries with css (the text disappears), it cannot be displayed even with the z-index with the highest value. Do you have any other solutions?

Best Regards
Richard Cech

[SeaTheme]

Hi,

Yes, there is z-index problem. The best solution is to edit the HTML/PHP code.

ps:
It seems that the slider text can be shown on your page now.

Best Regards

[richardcech]

Hello,
Thank you for answer. So can you advise me how to edit html / php code to make it work properly?

Best Regards
Richard Cech

[SeaTheme]

Hi,

We will add the option in the future. It is not necessary to custom the PHP file. It is not an easy job, it is very easy to cause some other issues.

ps:
I found you have set the image with auto height.
There is not the crop-image with auto height. There is not this issue on your website also.
The PHP custom is for the fluid and fixed height. Do you want to set the fluid or fixed height?

Best Regards

[richardcech]

Hello,
you’re right i got it on auto. It doesn’t matter to me if it’s going to be fluid or fixed. If we figure out how to make it look like it does now and it will work.
Probably your colleague offered me to present my page on your showcase site. This title page with a caption is very important for me to complete my page, …

Best Regards
Richard Cech

[SeaTheme]

Hi,

Please try to add the custom CSS:

.slide-item-wrap {
	position:relative;
	display:flex;
	flex-direction:column-reverse;
}
.slide-item-des {
	position:relative;
}
.carousel-img-wrap {
	position:relative;
	width:100%;
}
.module .slider-mod-wrap, .module .slider-style1 .owl-carousel {
    min-height: 60vh;
    height:auto!important;
}

PS:
Please backup and remove your own custom CSS.
You need to adjust the slider height (60vh means 60% of screen)

Best

[richardcech]

Hello,

Thank you very much. It works. When I put the height at 60 percent, it worked strangely when the screen resolution changed, however, after setting the slider on the auto, everything works as it should. Thanks a lot again.

Best Regards
Richard Cech

[Author]

Posts