Slider Nav Dots Labels

Currently in the slider component, there are dot icons which we can add numbers to. Is there a way to customize these labels and change the numbers to text links?

If not:

  1. Is there a way to add text links to bottom and use them to navigate through slides?

  2. Is there a way to display video in hero and change the video by clicking text link?

  3. Will custom nav labeling be a future option?

Thank you.


I resolved this, if anyone is looking for custom images or text links in slider - I used this link here: Different icons for every slider Thank you and props to bartekkustra for that.

I then made the following modifications to achieve text links:

	$(document).ready(function() {
		// config
		quest1 = 'What is UX?';
		quest2 = 'My design process.';
		quest3 = 'Why Hire me?';

		// do not touch
		imgbegin = '<img src="';
		imgend = '" />';
		// end

		// First dot.
		// Second dot.
		// Third dot.


and in head code :

.w-slider-dot {
  background: white;
  color: red;
  width: 35%;
  height: 35%;
.w-slider-dot.w-active {
  background: white;
    color: green;
    width: 35%;
  height: 35%;

Here is example that can be cloned:


Thank you for sharing such great experience! :+1:


This topic was automatically closed 60 days after the last reply. New replies are no longer allowed.