Public Forums 71,145 posts

[edd Friend eddJoin date: May 2006Posts: 350Downloads:11Uploads:73 Thanks: 76 Thanked: 8 times in 2 posts]

#1089860

Hello there 🙂
I’m using this purity III great template, and I would like to use the slide show, but, I dont understand how it works… it seems not to be like other slideshows…
Where I’m supposed to put the mages, where are located the controls? where can I modify settings?
Thanks a lot 🙂

[edd Friend eddJoin date: May 2006Posts: 350Downloads:11Uploads:73 Thanks: 76 Thanked: 8 times in 2 posts]

#1089867

Well, after several time looking in the forum, I found this post from 3 years ago:

https://www.joomlart.com/forums/topic/how-does-the-image-slideshow-work/

It has very interesting answers…

But now I have one more (I cannot find any answer in the forum): how to change slideshow speed?
Where can I do that?

Thanks a lot 🙂

[Saguaros Moderator SaguarosJoin date: September 2014Posts: 31405Downloads:237Uploads:471 Thanks: 845 Thanked: 5346 times in 4964 posts]

#1090039

Hi,

It’s just a custom HTML module and we use the Carousel for the slide, here is the output of module as in our demo site, before updating this content, you should disable the Editor in Global Configuration of your site first as it often strips HTML tags:

<div class="container">

<div id="carousel-example-generic" class="carousel slide" data-ride="carousel">
  <!-- Indicators -->
  <ol class="carousel-indicators">
    <li data-target="#carousel-example-generic" data-slide-to="0" class="active"></li>
    <li data-target="#carousel-example-generic" data-slide-to="1"></li>
    <li data-target="#carousel-example-generic" data-slide-to="2"></li>
  </ol>

  <!-- Wrapper for slides -->
  <div class="carousel-inner">

    <div class="item active">
     <img src="images/joomlart/slideshow/sl-1.jpg" alt="Sample image" />
      <div class="carousel-caption">
      <h2>Your perfect starting template, Purity III</h2>
      <p>Either it's your first time with Joomla or you are a developer already, Purity III won't let you down.</p>
     </div>
    </div>

    <div class="item">
      <img src="images/joomlart/slideshow/sl-2.jpg" alt="Sample image" />
      <div class="carousel-caption">
      <h2>This is the best FREE Joomla 3 template!</h2>
      <p>We have drunken too much of the best… but this repsonsive Joomla template truly is, and IT'S FREE!</p>
     </div>
    </div>
    <div class="item">
      <img src="images/joomlart/slideshow/sl-3.jpg" alt="Sample image" />
      <div class="carousel-caption">
      <h2>The next generation of Purity series</h2>
      <p>Sophisticated in Design, Brilliant in Features. That's how we define Purity Series.</p>
     </div>
    </div>
  </div>

  <!-- Controls -->
  <a class="left carousel-control" href="#carousel-example-generic" data-slide="prev">
    <span class="glyphicon glyphicon-chevron-left"></span>
  </a>
  <a class="right carousel-control" href="#carousel-example-generic" data-slide="next">
    <span class="glyphicon glyphicon-chevron-right"></span>
  </a>
</div>

</div>

In above output, you can see this line:

<div id="carousel-example-generic" class="carousel slide" data-ride="carousel">

change it to:

<div id="carousel-example-generic" class="carousel slide" data-ride="carousel" data-interval="500">

500 is the interval time for each slide in milliseconds

Regards

[edd Friend eddJoin date: May 2006Posts: 350Downloads:11Uploads:73 Thanks: 76 Thanked: 8 times in 2 posts]

#1090095

Woooo… thanks a lot…
😀

[Author]

Posts