CynthiaC Posted October 22 Share Posted October 22 Hello, using Hummingbird on PS 9.0 - I want to stop the main image on the product page from sliding non-stop automatically. Its annoying, especially on the mobile version. I want it to continue to slide, but just not automatically. Does anyone know where/how to adjust this is in the .tpl or CSS? Appreciate the help ! Link to comment Share on other sites More sharing options...
El Patron Posted October 23 Share Posted October 23 Locate the carousel script Open this file: /themes/hummingbird/assets/js/theme.js Search for code similar to: $('.product-cover .swiper').each(function() { new Swiper(this, { loop: true, autoplay: { delay: 4000, }, // other options... }); }); Disable autoplay Comment out or remove the autoplay block, or set it to false: autoplay: false, Example final config: new Swiper(this, { loop: true, autoplay: false, navigation: { nextEl: '.swiper-button-next', prevEl: '.swiper-button-prev' }, pagination: { el: '.swiper-pagination', clickable: true }, }); Link to comment Share on other sites More sharing options...
CynthiaC Posted October 24 Author Share Posted October 24 Thanks for the quick reply - Unfortunately, I couldnt find this ,or anything like this, in the file theme.js, in Hummingbird ... Link to comment Share on other sites More sharing options...
El Patron Posted October 24 Share Posted October 24 1 hour ago, CynthiaC said: Thanks for the quick reply - Unfortunately, I couldnt find this ,or anything like this, in the file theme.js, in Hummingbird ... Your welcome, I checked a dev 9.0.1, but expect same as 9.0.0. Link to comment Share on other sites More sharing options...
CynthiaC Posted October 24 Author Share Posted October 24 Hi again, yes I found this file - but I cannot find the script you mentioned above - tried searching autoplay, auto, swiper .. anything Link to comment Share on other sites More sharing options...
Andrei H Posted October 24 Share Posted October 24 (edited) Hello, This is a bootstrap carousel, not a swiper one. You can edit the following file: themes/hummingbird/templates/catalog/_partials/product-cover-thumbnails.tpl and on line 11, replace data-bs-ride="carousel" with data-bs-ride="false" If you have Template compilation set to Recompile templates if the files have been updated or Force compilation, the changes should be visible on page refresh. Otherwise, you will need to clear the cache. Edited October 24 by Andrei H Updated for product page (see edit history) 2 Link to comment Share on other sites More sharing options...
El Patron Posted October 24 Share Posted October 24 3 hours ago, CynthiaC said: Hi again, yes I found this file - but I cannot find the script you mentioned above - tried searching autoplay, auto, swiper .. anything my bad! I am sorry for providing incorrect answer above, let's try this here is where change needs to take place https://app.screencast.com/SyusJDfc03CtI update with: data-interval="0" clear cache 2 Link to comment Share on other sites More sharing options...
CynthiaC Posted October 24 Author Share Posted October 24 Guys ! You are heroes. both answers worked for me thank you 2 Link to comment Share on other sites More sharing options...
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment
Create an account
Sign up for a new account in our community. It's easy!
Register a new accountSign in
Already have an account? Sign in here.
Sign In Now