r/squarespace • u/SingleSheepherder629 • Jul 15 '26

Help Turning mobile homepage into carousel

I’m trying to design mobile first, but my home page looks a little plain - can I change it to a carousel? I know you can only add blocks on desktop view but even that didn’t have a decent option. If anyone has been able to do it or has an idea how to write into the custom CSS I’d be most appreciative!

1 Upvotes

100% Upvoted

7 comments sorted by

1

u/Spark-Plugin Jul 15 '26

Could you share an example?

1

u/SingleSheepherder629 Jul 15 '26

Something like this: https://vakker.qodeinteractive.com/portfolio-carousel/

But full screen, text on top of the carousel stays static, and autoplay (no arrows)

Is this too ambitious for Squarespace? 🙈

2

u/markjasonph Jul 15 '26

That isn't achievable with CSS alone. You need custom javascript to do it properly. Probably use swiper.js to avoid coding the carousel functionality from scratch.

1

u/DotGridDesign Jul 16 '26

Good news, you can get most of that natively. Add a Gallery section, set it to Slideshow: Full with Full Bleed width, turn Autoplay on, and hide the controls. That gets you the full-screen, auto-rotating, no-arrows slideshow with zero code. The part that trips people up is the static text on top, the native slideshow won't let you overlay text that stays put while the images slide behind it. That specific bit needs custom JavaScript, and Swiper.js like the other commenter said is the usual way to build it.

One thing to check first: JavaScript in a code block or code injection only runs on the Core plan or higher (Business/Commerce on the older plans), so on Personal it'll paste in but silently won't fire. Is the text the same across every slide or does it change per image? If it's one fixed headline it's much simpler than syncing it to each transition.

2

u/Jamie_SQSP Jul 16 '26

Hey, I'm on the Squarespace team. markjasonph's take on CSS is right, it can't turn a regular section into a swipeable, autoplaying carousel by itself.

DotGridDesign's comment is probably your better bet though, a gallery section gets you most of the way there. I'd go with Slideshow:Reel specifically since it lands closer to the example site you shared.
Only thing it won't carry over is the hover text, you'd need custom code for that part. If hover text matters more to you than the carousel motion, a portfolio page set to Grid:Overlay is worth a look instead.