Narrative Theme slideshow autoplay

elola
New Member
2 0 0

Hi,

 

I have 2 slideshows on the home page ( one with 2 photos and the other one with 8 photos) I applied this code to make both of slideshows on autoplay.

The problem is after the last photo the slideshow pause on a blank photo before it replays. I noticed that the slideshow pause on this blank photo until the second slideshow start and finish the play and this second slideshow does the same with a last blank page until the first one finish, and so on...

How can I make both of slideshow replay right after the last photo without having this paused blank photo?

The Code I applied founded in this community: https://community.shopify.com/c/Shopify-Design/Narrative-Theme-Slideshow-Autoplay/td-p/401765

Thanks.

0 Likes

Hello,

Thank you for your question.

Please share your store URL, page URL and also password (if your store has one), I'll help you out to the best of my ability.

Kind regards,
Diego

◦ Problem Solved? ✔️ Please click on Accept as Solution and like.
◦ Tutorials: Minimal theme product pages slideshow | Debut Theme product pages slideshow
◦ Looking to hire a reliable Shopify developer? Same day response: ezfycode@gmail.com.
0 Likes
elola
New Member
2 0 0
Click to expand...
 

Hi Diego, 

 

Thanks for your answer. 

I wonder if you can help me out by editing the code or giving me another code to have an autoplay the slideshow and reply after the last photo. 

Regards, 

0 Likes
wayofwood
New Member
2 0 0

I too am having the same problem.
I used the same code and it is indeed as first mentioned that all slideshows on the page are handled as a single slideshow so the code will autoplay the first slideshow, then the next, then the next, until coming back around. In the meanwhile it pauses on a blank slide.

The only differance I made in the code to make it work it the new version of narrative was changing the last line from:
sections.extend('slideshow', slideshowAutoExtension);
to
sections.extend('slideshowDesktop', slideshowAutoExtension);

0 Likes
Sahilaneja
Tourist
4 0 1

Hi 

I m using the narrative theme, could you please help with the code in order to have the slideshow autoplay on its own, cause right now it moves if I manually press the arrow key.

 

Thanks

 

0 Likes
cbohaty
New Member
1 0 0

I wanted to bump this thread. I'm using the same autoplay code suggested. At the end of the autoplay slideshow, it hangs on a black/blank slide for quite a bit of time before restarting. Any help would be great. Here is the code I entered into custom.js

 

var sections = window.theme.sections;
var slideshowAutoExtension = {
  init: function() {
    this.on('slideshow_desktop_init_done', this._autoplaySlideshow.bind(this));
  },
  _autoplaySlideshow: setInterval(function() {
    var $slide = $('.slideshow__slide--active')
                   .removeClass('slideshow__slide--active');

    var $button = $('.slideshow__button--active')
                   .removeClass('slideshow__button--active');

    var $slides = $('.slideshow__slide');

    var currentIndex = ($slides.index($slide) + 1) % $slides.length;

    $slides
      .eq(currentIndex)
      .addClass('slideshow__slide--active');

    var $buttons = $('.slideshow__button')
      .eq(currentIndex)
      .addClass('slideshow__button--active');

  }, 10000)

};

sections.extend('slideshow', slideshowAutoExtension);
0 Likes