[Resolved] Overlaying Images

[Author]

Posts

[Jo4nny8]

I am trying to: Overlay images with buttons and text

As in the expected image, i want to have a background slider that has images overlaid on top of it, for example a contact me section, or logo. Very much like the attached image from the 'demo' site.

Is this possible with layouts?

[Jo4nny8]

Result as below

[Beda]

Thank you for contacting us here in the Support Forum

Does this tutorial help you to achieve the goal?
hidden link

Please let me know if you need further infos about this.

Thank you for your patience.

[Jo4nny8]

Hi

I've ten a look and yes it does sort of.

I've had good success with using the standard slider built into layouts and am able to add titles and text to each image I add, then using classes adjust them to suit. The text and everything is central and responsive just how it should be.

The problem with this is the standard slider has pagination controls built in which I don't want to show but there's no option to remove these.

Can pagination be removed somehow as if I try duplicating the slider with either a custom view or content template it just doesn't work as well.

Thank you

[Beda]

Thanks for the Details

Assuming you want to use the Layouts Slider:

1. The carousel indicators (screenshot 1) can be removed with this CSS:

ol.carousel-indicators {
  display: none;
}

2. The Left and Right pagination carousel navigators can be hidden with the same rule:

a.left.carousel-control, a.right.carousel-control {
  display: none;
}

Keep in mind, that if you remove them you need autoplay enabled, otherwise the slider is not working as the links aren't there

With Views, you can simply create a "Display results as a slider" View, and there will been pagination, if you use default settings and no pagination code.
(Pagination enabled with automatic transition)

Please let me know if you need further infos about this.

Thank you for your patience.

[Jo4nny8]

Thats brilliant and it works perfectly thank you!