YEEES! I'm THRILLED to hear you were able to implement the customization on your own!! That's amazing!! 🙌 I'm happy I could help and I really appreciate your comment. Thank you so much!
You're welcome! There's a snippet at the bottom of the post that you can use to make that happen on the live site: www.beatrizcaraballo.com/blog/auto-layout-banner-slideshow-autoplay-ken-burns Hope that helps!
I'm happy to hear that! ☺ And sure thing, you'll need to add your data-section-id before the selectors .user-items-list-banner-slideshow__arrow-button--right and .user-items-list-banner-slideshow inside their corresponding JS/CSS snippets in the code. That will look like this once you change them: body:not(.sqs-edit-mode-active) [YOUR-DATA-SECTION-ID-HERE] .user-items-list-banner-slideshow__arrow-button--right [YOUR-DATA-SECTION-ID-HERE] .user-items-list-banner-slideshow .list-item:not([aria-hidden="true"]) img [YOUR-DATA-SECTION-ID-HERE] .user-items-list-banner-slideshow .list-item img Hope that helps!
I am not a web designer, just someone trying to make a proper website somehow! Interesting content and well explained, would be amazing to cover how to do this to a photo gallery (carrousel) to enable a smooth and sweet transitions between images!
Thank you so much for this! Do you know if there's a way to slow down the transition speed? Not the time each slide takes on screen, but the 'sliding time' from one slide to the next
You're most welcome! Even when there IS a way to slow down that sliding time, I wouldn't recommend it. Because of how the original sliding animation is built, there would be a really odd white gap showing in between slides after the code is added: .user-items-list-banner-slideshow .list-item { transition: transform 3s; } As you can see, because the slides come in from the same side, things look... weird. I believe the whole sliding setup would need to be rebuilt to get the effect working correctly. But in that case I would suggest building your own slider from scratch with a js plugin like splidejs instead. Hope this helps!
@@beatrizecaraballo Oh, thank you! Got it! I was thinking of a better visual rather than just the slide, maybe a fade onto the next one, or a slower transition. I'll try out different alternatives, and if nothing works, I'll stick to it plus Ken Burns. Thanks once again! 🙂
You're welcome! Also, if you're interested in a fade-in effect, someone else inquired about that via email so I'm currently looking into it! I'm still unsure if I'll be able to make it into a tutorial or need to turn it into a plugin, but feel free to shoot me an email at hey@beatrizcaraballo.com if you'd like me to notify what comes out!
