Template: Carousel

From LibrePlanet
Jump to: navigation, search
Line 19: Line 19:
 
|Caption4=
 
|Caption4=
 
|Link4=
 
|Link4=
 +
|Image5=
 +
|Title5=
 +
|Caption5=
 +
|Link5=
 
}}
 
}}
 
</pre>
 
</pre>
Line 30: Line 34:
 
<li data-target="#MyCarousel" data-slide-to="2"></li>
 
<li data-target="#MyCarousel" data-slide-to="2"></li>
 
<li data-target="#MyCarousel" data-slide-to="3"></li>
 
<li data-target="#MyCarousel" data-slide-to="3"></li>
 +
<li data-target="#MyCarousel" data-slide-to="4"></li>
 
</ol>
 
</ol>
 
<!-- Carousel items -->
 
<!-- Carousel items -->
Line 65: Line 70:
 
</div><!-- /.carousel-caption -->
 
</div><!-- /.carousel-caption -->
 
</div><!-- /Slide4 -->
 
</div><!-- /Slide4 -->
 +
<!-- Slide 5 -->
 +
<div class="item ">
 +
[[File:{{{Image5|}}}{{!}}class=img-responsive{{!}}link={{{Link5}}}]]
 +
<div class="carousel-caption">
 +
<h3>{{{Title5|}}}</h3>
 +
<p>{{{Caption5}}}</p>
 +
</div><!-- /.carousel-caption -->
 +
</div><!-- /Slide5 -->
 
</div><!-- /.carousel-inner -->
 
</div><!-- /.carousel-inner -->
 
<!-- Controls removed --></div><!-- /#MyCarousel -->
 
<!-- Controls removed --></div><!-- /#MyCarousel -->
 
</div><!-- /.main-slider --></includeonly>
 
</div><!-- /.main-slider --></includeonly>

Revision as of 18:12, 28 October 2021

This is the template "Carousel". This template will display Bootstrap Carrousel with five images (incl. titles and captions). It uses custom styling to enable fading instead of sliding images.

{{Carousel
|Image1=
|Title1=
|Caption1=
|Link1=
|Image2=
|Title2=
|Caption2=
|Link2=
|Image3=
|Title3=
|Caption3=
|Link3=
|Image4=
|Title4=
|Caption4=
|Link4=
|Image5=
|Title5=
|Caption5=
|Link5=
}}

Edit this page to inspect the template text.