Skip Navigation

[Resolved] Custom HTML bootstrap slider

This thread is resolved. Here is a description of the problem and solution.

Problem:
Do you have any examples of native Bootstrap Sliders?

Solution:
https://www.w3schools.com/bootstrap/bootstrap_images.asp

You usually will use Bootstrap grid and some basic HTML
This is the native Bootstrap Example:
https://getbootstrap.com/docs/3.3/javascript/#carousel

That could be adapted to what you need since you can alter the HTML of it.

This support ticket is created 5 years, 8 months ago. There's a good chance that you are reading advice that it now obsolete.

This is the technical support forum for Toolset - a suite of plugins for developing WordPress sites without writing PHP.

Everyone can read this forum, but only Toolset clients can post in it. Toolset support works 6 days per week, 19 hours per day.

Sun Mon Tue Wed Thu Fri Sat
- - 14:00 – 20:00 14:00 – 20:00 14:00 – 20:00 14:00 – 20:00 14:00 – 20:00
- - - - - - -

Supporter timezone: Asia/Ho_Chi_Minh (GMT+07:00)

This topic contains 3 replies, has 2 voices.

Last updated by Beda 5 years, 8 months ago.

Assisted by: Beda.

Author
Posts
#957135

I'm trying to use the layouts slider as a hero slider in my multi site.

The slider works as expected, but there is no field to add a link to the slider item (image).

I know there is description field that takes html.

I've tried adding a link in there, but the link can't be clicked as the slider pagination is taking precedence over the space.

Is there a way to make the slider items clickable (link to something)??

#957253

That is coming from bootstrap.
It does not intend as it seems to show those over the actual "item active" of the "carousel-inner" div.
It has for some reasons z-index 10.
However it won't help to increase that value.

They are always behind the image and the z-index of the navigation elements also is higher (15) which disturbs it here too.

Only if you increase the carousel-caption z-inmdex and decrease the img z-index you'll have that link clickable.

Another possible approach is to use a manually created gallery, that you can edit to add wrapping links around the images

You can for example add that to a Content Template and call it in a Layout.
Since you hardcode the Images, it should not be a issue to have them hardcoded in the Content Template

Please let me know if you would need help with that HTML.

I think we should as well try to adjust that in Layouts, as in a "normal" caption (since usually not over, but under the post) those HTML elements work because clickable.

I will report that and we will see what we can do about.
(Irrelated to the fact that it seems something that comes with Bootstrap natively in those scenarios.)

#958721

Thanks for your response. You've given me a couple of things to think about.

To answer your question, "Please let me know if you would need help with that HTML.", .....yes please, can you make that available to me.

Many thanks.

#1068538

hidden link

You usually will use Bootstrap grid and some basic HTML
This is the native Bootstrap Example:
hidden link

That could be adapted to what you need, since you can alter the HTML of it.

This ticket is now closed. If you're a WPML client and need related help, please open a new support ticket.