How to Create Image Sequence Scroll Animation From a URL in WordPress?

Key Takeaways

  • Nexter Blocks features the Scroll Sequence block, allowing users to add a scroll sequence image from a remote server via image URL.
  • Users must name images in a number sequence like 1.jpg, 2.jpg, and specify the total number of images in their sequence.
  • Supported image types for the Scroll Sequence block include JPG, PNG, and WebP.
Table of Contents

Are you looking to create an image sequence scroll animation from a remote URL without adding hundreds of images to your WordPress media library? This method helps you save storage space by hosting your image sequence remotely, which can optimize performance and make media management much easier. This technique ensures a visually engaging effect while keeping your WordPress installation streamlined. 

With the Scroll Sequence block from Nexter Blocks, you can easily add a scroll sequence image from a remote server via the image URL in WordPress.

To check the complete feature overview documentation of the Nexter Blocks Scroll Sequence block, click here.

Requirement  – This block is a part of the Nexter Blocks, make sure it’s installed & activated to enjoy all its powers.

To do this, add the Scroll Sequence block to the page and follow the steps – 

1. Select Remote Server from the Upload Type section.

scroll sequence url 1

2. Then in the Folder Path, you have to add the image folder path without the image name.

For example, https://website-name.com/images/

Note: You have to name your images in a number sequence followed by the image extension like 1.jpg, 2.jpg, 3.jpg etc.

If you have saved your image with a prefix like image-1.jpg, image-2.jpg, image-3.jpg etc. then in the Prefix field, you have to add image-.

From the Digit dropdown, you have to choose the number sequence that you’ve used on your images. For example, if you have saved your images like image-01.jpg, image-02.jpg, image-03.jpg etc. then you have to select 01 – 99.

From the Image Type section, you have to select your image extension.

Note: Supported image type – JPG, PNG and WebP.

In the Total Image section, you have to mention the total number of images in your sequence.

3. Then select the appropriate option from the Apply To dropdown where you want to add the sequence animation.

If you don’t have long enough content on the page or the container, then set a minimum height for the container or use a Spacer block to add long enough space for the user to scroll.

With all the settings in place, you should have an image scroll sequence from your image URL.

About the Author

Photo of Aditya Sharma CMO of NexterWP
CMO at POSIMYTH Innovations · NexterWP · 7 years experience

He has spent years in the WordPress ecosystem building, breaking, and optimizing sites until they actually perform. He works at the intersection of speed, growth, and usability, helping creators ship websites that load fast and convert. An active WordPress community contributor sharing through tools, tutorials, and direct collaboration. Tested practice, not theory.

WordpressThemesElementorn8nAIClaudeAutomationServer

Share your Thoughts

Get Instant Answers to all your questions about Nexter Blocks,
Extensions & Theme trained on 1000+ Docs and Videos

Still in Doubt? Let’s Assist You

Have Feedback or Questions?

Join our WordPress Community on Facebook!

Related Frequently Asked Questions

What if my image sequence isn't displaying correctly?

If your image sequence isn't showing up, check that the image URLs are correct and that they follow the naming convention specified. Images should be named in a numeric sequence like 1.jpg, 2.jpg, etc. If you used a prefix, ensure it's entered correctly in the Prefix field. This is crucial for the Scroll Sequence block from Nexter Blocks to function properly.

What settings work best for creating an image sequence scroll animation?

For optimal results, ensure that the total number of images matches the images you have hosted. Use a minimum height for the container if your content is short, or add a Spacer block to allow enough scrolling space. This will enhance the user experience and ensure the animation plays smoothly.

Is there a limit to the number of images I can use in the sequence?

While the tutorial does not specify a strict limit on the number of images, it's essential to consider performance. Using too many images can slow down your page load times. Aim for a balanced number that maintains visual engagement without compromising performance.

How do I ensure my images load quickly for the scroll animation?

To ensure quick loading of your images, host them on a reliable server and optimize their file sizes. Using formats like WebP can help reduce loading times. This is particularly important when creating an image sequence scroll animation, as slow-loading images can disrupt the user experience.

Last reviewed: April 14, 2026

Related Docs