The Single Image Scroll widget by Enter Addons is a powerful feature designed for Elementor users who want to add an interactive, scrollable image experience to their websites. Whether you’re displaying a portfolio, infographic, or tall product photo, this widget helps enhance user interaction through vertical or horizontal scrolling effects.
What is the Single Image Scroll Widget?
The Single Image Scroll Widget lets you display large or vertically extended images in a limited frame. Visitors can either hover or drag to scroll through the image. It’s ideal for photographers, designers, e-commerce sites, and bloggers who want to showcase detailed visuals with style.
Main Features:
- Scroll image on hover or drag
- Vertical and horizontal scrolling options
- Full control over image scroll speed
- Customizable image wrapper
- Badge and link features for CTA or branding
Why Use Image Scroll Widgets?
Using an image scroll or scrolling picture widget boosts visual engagement and helps present more content in a compact space. It’s great for storytelling, product showcases, or infographic-based content.
Benefits include:
- Enhanced user interaction
- Smooth and elegant scroll transitions
- SEO benefits by reducing bounce rate
- Mobile-friendly scroll view
If need any expert help feel free to Contact Us or Book A Meeting.
Step-by-Step Guide: How to Use Single Image Scroll Widget
Step 1: Add the Widget to Your Page
- Open Elementor Editor.
- On the left menu, find Single Image Scroll Widget under Enter Addons.
- Drag and drop the widget into your chosen section.
You will now see a basic setup with scroll settings and options for customization.
Step 2: Content Tab Overview
Inside the Content tab, you’ll find two main sections:
- Single Image Scroll
- Badge & Link
Single Image Scroll Section
- Scroll Type: Choose between Hover or Drag style.
- Image Upload: Upload your high-quality graphic or photo scroll image.
- Scroll Direction: Choose Vertical or Horizontal.
- Image Wrapper Width & Height: Adjust to fit your layout.
- Transition Speed: Set the smoothness from 1 to 50 (only for hover).
If you select the Hover Style, the image scrolls when the user hovers over the widget. If you select Drag Style, users can manually drag to scroll through the image.
If you choose Hover Style. Follow the video to setup widget.
If you choose Drag Style. Follow the video to setup widget.
Step 3: Badge & Link Setup
In the Badge & Link section:
- Toggle Enable Badge ON/OFF
- Add your Badge Title (like “New”, “Sale” etc.)
- Set the Wrapper Link – this can lead to a product page or external site
Badges help draw attention and increase click-through rates. Linking makes the scrollable picture interactive and actionable.
Step 4: Style Tab Customizations
The Style tab lets you enhance the look of your scroll image widget.
Image Wrapper Settings
- Margin & Padding: Space control around the scroll image
- Border-Type: Solid, dashed, dotted, etc.
- Box Shadow: Add shadows for 3D depth
- Border Radius: Curve your image corners
- Hover View: Choose effects like zoom or brightness on hover
Badge Style Settings
- Color: Set font and background color
- Typography: Choose fonts, sizes, and weights
- Offset (Vertical & Horizontal): Adjust badge position
- Padding & Border Radius: Control spacing and rounding
Tips for Best Visual Scroll Design
- Use high-resolution vertical images for smooth photo scroll.
- Maintain good contrast between badge and image.
- Use image scroll bar sparingly for cleaner UX.
- Combine with Elementor Vertical Scroll Slider for dynamic layouts.
- Test both hover and drag styles for desktop and mobile responsiveness.
Optimizing for SEO and Performance
To make your page highly search engine friendly:
- Image ALT Tags: Add alt tags like scrollable image of product, vertical scroll image, graphic scroll design.
- Lazy Load Images: Reduces load time
- Use Keywords Naturally: Include terms like scroller picture, pic scroller, elementor overlapping scroll plugin in your content
Single Image Scroll vs. Elementor Native Image Widget
| Feature | Single Image Scroll Widget | Elementor Image Widget |
|---|---|---|
| Scroll Effect | ✅ Yes | ❌ No |
| Hover/Drag Option | ✅ Yes | ❌ No |
| Badge & Link Support | ✅ Yes | ✅ Yes (basic) |
| Scroll Direction Control | ✅ Vertical/Horizontal | ❌ Static |
| Use Case Versatility | ✅ High | 🚫 Limited |
Common Use Cases for Scrollable Image Widget
- Infographic Showcase: Display tall infographics with vertical scroll.
- Portfolio Display: Highlight long screenshots or design panels.
- Product Features: Show detailed views of clothing, tools, or furniture.
- Photography Display: Scroll through landscape or full-body portraits.
- Step-by-Step Tutorials: Use scroll image to show tutorial screenshots.
Conclusion
Create stunning scrollable images with Enter Addons. Use Single Image Scroll widget to add interactive scrolling effects. Try the image scroll widget now!
The Single Image Scroll Widget from Enter Addons gives you creative control over how users experience your content. Whether you’re showcasing scrollable pictures, graphic scrolls, or detailed product shots, this Elementor widget enhances your site’s interactivity and SEO.
Explore all scroll options—hover, drag, horizontal, and vertical—and give your visitors a reason to stay and engage.
Start using the Single Image Scroll widget today and transform how you display visual content!
FAQs For Single Image Scroll Widget
What is the best image format for the image scroll widget?
Use JPG or PNG for clarity. Prefer vertical images for scroll-focused layouts.
Can I use this widget for free?
Yes! The widget is part of Enter Addons which offers scroller free use options.
Can I link the scrolling picture to another page?
Absolutely. Use the Wrapper Link option in the Badge & Link section.
Is the widget mobile responsive?
Yes. Both scroll types work well on phones and tablets.
Is it possible to combine with other Elementor effects?
Yes. Try combining it with the Elementor overlapping scroll plugin for layered animations.
Does it support vertical and horizontal image scrolls?
Yes. You can select the scroll direction from the settings.
What’s the difference between Hover and Drag style?
Hover style scrolls on mouse-over; Drag style allows manual movement.
Does the widget come with scroller images or templates?
No built-in templates, but you can use your own scroll image, scroller picture, or download free scroll pictures.