How to prolong time of displaying of images in carousel slideshow I use Bootstrap 3-based Drupal 8 theme (Jethro). In the header, I have carousel of sliding images. They change every 5 seconds. I'd like to prolong this time to e.g. 30 seconds, so that every image is displayed for 30 seconds, not 5. So far I found only how to change speed of the change, animation, which is not the task. Any idea how to do it?

What I tried

In bootstrap.css and bootstrap.min.css:

.carousel-inner .item {
  ...
  transition: 30s ease-in-out left; # Increase time here
  } # Together with below it makes sliding slower, nothing more


and in bootstrap.js and bootstrap.min.js:

this.interval = 50000 // It does nothing
interval: 5000 * 10 // In Carousel.DEFAULTS; it makes sliding slower
Comparing with w3schools example (specifically line &lt;div id="myCarousel"...) - inserting data-interval="30000" there (the line then looks like &lt;div id="myCarousel" class="carousel slide" data-ride="carousel" data-interval="30000"&gt;) does the trick.

In the Jethro theme (and probably in any similar case), this backbone is in the file templates/page.html.twig (in version 2.0 line 85). So that inserting data-interval="30000" there does the trick. The line then looks like &lt;div id="myCarousel" class="carousel slide" data-ride="carousel" data-interval="30000"&gt;. Might be this is not the most elegant way, but it works well.