sorethumb Posted March 30, 2020 Share Posted March 30, 2020 I'm wondering how to make a auto-scrolling carousel block on Squarespace 7.1 templates. I'm trying to make an auto-scrolling testimonials section. ROROk and Becs 2 Link to comment
bluegalaxy Posted April 11, 2020 Share Posted April 11, 2020 You can do it by creating images for your testimonials and then use a gallery block, slideshow: simple, turn on autoplay. Hopefully this feature will be added back in, there is also a paid plugin for it, but I have not tried it. Link to comment
scipioni_central Posted April 14, 2020 Share Posted April 14, 2020 I checked with SS help on this recently and they said that a slide show gallery will not autoplay. Someone in the forum gave me this code, which I placed in the Advanced area of the settings for the page. Seems to be working fine. Now, if I could find someone who can help me add code for a carousel that will insert padding between images... Quote <script> Y.on('domready', function () { var galleries = Y.Squarespace.GalleryManager.getGalleries(); for( i = 0; i<galleries.length; i++){ galleries[i].setAttrs({"autoplay":true}) } }); </script> SaraB, tuanphan and Becs 3 Link to comment
SaraB Posted April 15, 2020 Share Posted April 15, 2020 scipioni_central - I used your code and it worked! yay! Can you tell me how to slow the speed down? Thanks so much! Link to comment
bluegalaxy Posted April 15, 2020 Share Posted April 15, 2020 Great that you have code for this. There is also slideshow gallery with Autoplay and you can adjust the speed from 1-10. It's the gallery type Simple Slideshow, and scroll down to edit the Autoplay and Slide Duration settings. Link to comment
scipioni_central Posted April 16, 2020 Share Posted April 16, 2020 RIght, I was actually trying to create an autoscrolling carousel from a gallery, but when I do that, the images are flush up against one another, and I can't find anyone who knows how to add padding to the images in the carousel... along with the autoscroll. Any suggestions? Link to comment
Guest Posted April 22, 2020 Share Posted April 22, 2020 Hi! Maybe someone can tell you. How to increase "Slide Duration" at the slideshow block? More than standart 10s.. Thanks! Link to comment
Julia-K Posted April 24, 2020 Share Posted April 24, 2020 (edited) ghostplugins.com has a great plugin -- https://www.ghostplugins.com/products/super-slideshow-gallery-autoplay-version Here is a quick review -- Edited April 24, 2020 by Julia-K christyprice 1 Link to comment
TFC Posted June 12, 2020 Share Posted June 12, 2020 Hi all, I'm struggling with this too. I did the gallery view bit, but the text is below the image, vs as a centered an overlay. Any workarounds that you know of? Link to comment
tuanphan Posted June 12, 2020 Share Posted June 12, 2020 8 hours ago, heller said: Hi all, I'm struggling with this too. I did the gallery view bit, but the text is below the image, vs as a centered an overlay. Any workarounds that you know of? and you want? Email me if you have need any help (free, of course.). Answer within 24 hours. Or send to forum message How to: Setup Password & Share url - Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care Link to comment
TFC Posted June 12, 2020 Share Posted June 12, 2020 i'm trying to get the text to overlay on the center of an image, vs. below. like a testimonial slider - does that make sense? something like this: Link to comment
Becs Posted June 28, 2020 Share Posted June 28, 2020 (edited) Further to the above... Using 7.1 Template (on trial site in setup)- I need this for my Home Page (Landing Page) for a logo gallery at the bottom of the page - that automatically scrolls. However nothing happened when I posted the above code into the Page - Advanced - code injection. Is this because "Page Header Code Injection adds code to the <head> tag of that page. It won't display on Index landing pages." ?? So no way to put on Home Landing Page? see SS ref: https://support.squarespace.com/hc/en-us/articles/205815908 This is what I am wanting a smooth small scrolling logo section at bottom of home page:https://unita.com.au/ (I found this from this post however it's not smooth scrolling: https://www.will-myers.com/scrolling-logo-in-squarespace) Edited June 28, 2020 by Becs add like this site: Link to comment
Rebecca_Grace_Designs Posted September 18, 2020 Share Posted September 18, 2020 (edited) **UPDATED*** For anyone still looking, I found a workaround for autoplaying a Summary Carousel Block. It autoclicks the next button every three seconds. Inject this is Settings > Advanced > Code Injection > Footer <script> window.onload = function() { var nextArrow = document.querySelector(".summary-carousel-pager-next"); function clickNext() { nextArrow.click(); } setInterval(clickNext, 3000); }; </script> I updated this code to remove the use of JQuery (for page speed reasons) as well as to help with the refresh timeframe. Edited March 26, 2021 by rebeccagracedesigns I updated this code to remove the use of JQuery (for page speed reasons) as well as to help with the refresh timeframe. awcs, amberwavescreative, nazaninp and 7 others 5 5 Coding Wiz at rebeccagracedesigns.com 📖 Code Encyclopedia for Squarespace: rebeccagracedesigns.com/encyclopedia-of-code 🔥 Free CSS Tutorials: rebeccagracedesigns.com/blog ⭐️ Free Guide to the 41 Most Popular CSS Properties: rebeccagracedesigns.com/popular-css-properties Link to comment
TFC Posted September 21, 2020 Share Posted September 21, 2020 Thanks for posting! Will check it out this week! Link to comment
Artsyp Posted October 10, 2020 Share Posted October 10, 2020 I have been looking everywhere for weeks for this!! Thank you! It works! But, how do I slow it down? Link to comment
creedon Posted October 11, 2020 Share Posted October 11, 2020 @Artsyp Increase the setInterval milliseconds. 3000 is 3 seconds. 5000 is 5 seconds. Etc. Find my contributions useful? Please like, upvote, mark my answer as best , and see my profile. Thanks for your support! Link to comment
Carli Posted November 3, 2020 Share Posted November 3, 2020 On 9/19/2020 at 7:51 AM, rebeccagracedesigns said: For anyone still looking, I found a workaround for autoplaying a Summary Carousel Block. It autoclicks the next button every three seconds. Inject this is Settings > Advanced > Code Injection > Header <!-- jQuery Library --> <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script> and this in Settings > Advanced > Code Injection > Footer <!-- Summary Block Autoplay --> <script> setInterval(click, 3000); function click() { $(".summary-carousel-pager-next").click(); } </script> I will probably add this to my blog!! Hi Rebecca, I searched forever for this and it works great, thank you. Is there a way I can apply it to a single carousel? Red11Media 1 Link to comment
tuanphan Posted November 3, 2020 Share Posted November 3, 2020 1 hour ago, Carli said: Hi Rebecca, I searched forever for this and it works great, thank you. Is there a way I can apply it to a single carousel? change this line .summary-carousel-pager-next to #summary-block-id .summary-carousel-pager-next Find id with this tool https://chrome.google.com/webstore/detail/squarespace-collectionblo/bggpdfnccodbnmcndckmeehdjkjojkde amberwavescreative 1 Email me if you have need any help (free, of course.). Answer within 24 hours. Or send to forum message How to: Setup Password & Share url - Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care Link to comment
Carli Posted November 3, 2020 Share Posted November 3, 2020 56 minutes ago, tuanphan said: change this line .summary-carousel-pager-next to #summary-block-id .summary-carousel-pager-next Find id with this tool https://chrome.google.com/webstore/detail/squarespace-collectionblo/bggpdfnccodbnmcndckmeehdjkjojkde thank you! Rebecca_Grace_Designs 1 Link to comment
gabrielamadeus Posted November 13, 2020 Share Posted November 13, 2020 On 9/18/2020 at 2:51 PM, rebeccagracedesigns said: For anyone still looking, I found a workaround for autoplaying a Summary Carousel Block. It autoclicks the next button every three seconds. Inject this is Settings > Advanced > Code Injection > Header <!-- jQuery Library --> <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script> and this in Settings > Advanced > Code Injection > Footer <!-- Summary Block Autoplay --> <script> setInterval(click, 3000); function click() { $(".summary-carousel-pager-next").click(); } </script> I will probably add this to my blog!! Curious if there's anyway to loop this autoplay function? Similar to how the native autoplay gallery works in squarespace. I've got 10ish featured posts in a carousel that autoplays/scrolls on my homepage, but it's usually finished advancing and static by the time users scroll down to it: https://oregontimbertrail.org/ Thanks in advance! (also hiding the next/prev arrows would be nifty too but not a deal breaker) Link to comment
tuanphan Posted November 20, 2020 Share Posted November 20, 2020 On 11/13/2020 at 11:24 PM, gabrielamadeus said: Curious if there's anyway to loop this autoplay function? Similar to how the native autoplay gallery works in squarespace. I've got 10ish featured posts in a carousel that autoplays/scrolls on my homepage, but it's usually finished advancing and static by the time users scroll down to it: https://oregontimbertrail.org/ Thanks in advance! (also hiding the next/prev arrows would be nifty too but not a deal breaker) Hi. Have you found the solution yet? Email me if you have need any help (free, of course.). Answer within 24 hours. Or send to forum message How to: Setup Password & Share url - Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care Link to comment
Brian_Bers Posted December 29, 2020 Share Posted December 29, 2020 On 11/13/2020 at 10:24 AM, gabrielamadeus said: Curious if there's anyway to loop this autoplay function? Similar to how the native autoplay gallery works in squarespace. I've got 10ish featured posts in a carousel that autoplays/scrolls on my homepage, but it's usually finished advancing and static by the time users scroll down to it: https://oregontimbertrail.org/ Thanks in advance! (also hiding the next/prev arrows would be nifty too but not a deal breaker) Bump. Looking for the same thing! It appears that this script does in fact "reset" after sitting on the last display group for ~25 seconds regardless of the click time interval. But that's much too long for my and most applications, I would think. Possible to modify this behavior? Link to comment
tuanphan Posted December 30, 2020 Share Posted December 30, 2020 13 hours ago, Brian_Bers said: Bump. Looking for the same thing! It appears that this script does in fact "reset" after sitting on the last display group for ~25 seconds regardless of the click time interval. But that's much too long for my and most applications, I would think. Possible to modify this behavior? Which script code did you use? Email me if you have need any help (free, of course.). Answer within 24 hours. Or send to forum message How to: Setup Password & Share url - Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care Link to comment
Brian_Bers Posted December 30, 2020 Share Posted December 30, 2020 This one On 9/18/2020 at 4:51 PM, rebeccagracedesigns said: For anyone still looking, I found a workaround for autoplaying a Summary Carousel Block. It autoclicks the next button every three seconds. Inject this is Settings > Advanced > Code Injection > Header <!-- jQuery Library --> <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script> and this in Settings > Advanced > Code Injection > Footer <!-- Summary Block Autoplay --> <script> setInterval(click, 3000); function click() { $(".summary-carousel-pager-next").click(); } </script> I will probably add this to my blog!! MunicipalMan 1 Link to comment
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment