How to add Smooth, Eye-Catching Scrolling Text to Your Shopify Store
Want to add movement and energy to your store? The Text Scroller lets you display text or images in a smooth, continuous scrolling line, perfect for announcements, brand logos, or eye-catching messages. It's a simple way to make your storefront feel more dynamic and professional.
Want to see it in action first? View the live demo to get a feel for how it looks on your store.
Installation via Code Editor
The installation is easy, just follow these steps:
- Go to Online Store > Themes > Edit code
- In the Sections folder, click Add a new section
- Name it sj-text-scroller.liquid and click Done
-
Copy the code from the gist below and paste it into the file
- Click Save
- Go to Customize and add the Text Scroller section to your desired page
Customization Settings
Step 1: Basic Setup & Global Styling
Start by adding text or image blocks to your scroller. By default, any customization you make, such as font size, spacing, colors, or borders, applies to all blocks, keeping a consistent look across your scroller. You can also set the scrolling direction (left-to-right or right-to-left) and adjust speed separately for desktop and mobile devices.
If needed, you can enable individual block customization for specific blocks, allowing unique fonts, colors, spacing, or links for each item while still maintaining global defaults for the rest.
Step 2: Advanced Design & Styling (Optional)
Take your scroller further by customizing the background color, text gradients, and more. You can fine-tune padding, top and bottom spacing, and even apply a subtle inclination tilt for extra visual flair. Pause-on-hover and link behaviors can also be adjusted for a more interactive experience.
All advanced settings respect the global defaults unless individual block customization is toggled on, making it easy to create both cohesive and varied scroller content.
Keep Visitors Engaged
The Text Scroller adds movement, style, and interactivity to your Shopify store. Whether you're promoting new arrivals, showing off partner logos, or adding a touch of motion to your design, this section helps your content stand out instantly.
At EZFY Code, we also offer custom development for merchants looking for unique solutions tailored to their business. If you have a specific idea or need a custom feature built for your store, feel free to reach out.