Scroll Box Pro 2.0 is a modern Joomla marquee module for announcements, headlines, and promos. It uses vanilla CSS and JavaScript (prefix jx-sb) — no jQuery.

What can it do?

• Content from single text, a custom items list, category articles, or a single article
• Four directions: left, right, up, and down with seamless looping
• Five ready themes: Modern, Minimal, Dark, Soft, Contrast
• Header label, play / pause, fade edges, and pause on hover
• Speed in pixels per second and gap control between loops

Who is this for?

• News and promo strips
• Store and school announcements
• Agency demos and landing pages
• Any site that needs a readable scrolling message

Works with

• Joomla 4, 5, and 6
• Phones, tablets, and desktops
• Multiple module instances on the same page

Tip: Start with the Modern theme, turn on the header label, and use Custom Items for the strongest first impression.

Downloading the Extension

Email: After purchasing from our store, you will receive an email with the download link.

Store: You can also download it from the Downloads section. Create an account with the same email used at purchase if you are new.

Package: ScrollBoxPro_UNZIP.zip

Unzip the Package

• Unzip ScrollBoxPro_UNZIP.zip.
• Inside you will find:
  • mod_scrollbox_2.0.zip — install this for Joomla 4, 5 & 6
  • ReadMe.txt — notes for the current version

Install in Joomla

1. Log in to the Joomla administrator.
2. Go to System → Install → Extensions.
3. Open the Upload Package File tab.
4. Choose mod_scrollbox_2.0.zip.
5. Click Upload & Install.
6. Wait for the green success message.

Create and publish a module

1. Go to Content → Site Modules (or Extensions → Modules).
2. Click New and select Scroll Box Pro.
3. Set a title, choose a module position, and set Status to Published.
4. Assign the module to the menu items where it should appear.
5. Save.

Requirements: Joomla 4.x / 5.x / 6.x and PHP 8.0+.

Open your Scroll Box Pro module and use the tabs below. Every option is managed from the backend.

Content

• Content Source — Single text / HTML, Custom items list, Articles from categories, or Single article.
• Scroll text — editor content when using single text (optional link URL).
• Custom Items — repeatable rows with text and optional link.
• Categories / Count / Ordering — article feed options when using categories.
• Use article title only — show titles instead of intro text (articles source).
• Strip HTML, max length, item separator, and empty message.

Display

• Show Header Label — badge text such as “News” or “Breaking”.
• Show Play / Pause — visitor control button.
• Fade Edges — soft mask on the scroll edges.
• Link Target — same window or new window.
• nofollow — optional rel="nofollow" on links.

Motion

• Direction — left, right, up, or down (labels match travel direction).
• Speed — pixels per second (typical range 30–80).
• Gap Between Loops — space before the content repeats.
• Pause on Hover / Focus — stops motion while the visitor reads.

Look

• Theme — Modern, Minimal, Dark, Soft, or Contrast.
• Accent, Background, Text, Border — colour controls.
• Font size / weight, width, height, and corner radius.
• Height tip: use auto for horizontal tickers; set a px height (for example 160px) for vertical scroll.

Advanced

• Module Class Suffix — extra CSS class on the module.
• Extra CSS — custom rules scoped to your needs.

Quick start with custom items

1. Set Content Source to Custom items list.
2. Add several short messages with optional links.
3. Choose theme Modern, enable the header label, and publish.

Quick start with articles

1. Set Content Source to Articles from categories.
2. Select categories and turn on Use article title only for a clean ticker.
3. Set direction to Left and publish.

Vertical scroll

1. Set direction to Up or Down.
2. Give the box a fixed height in Look (for example 160px).
3. Use Soft or Modern theme for announcement digests.

Visitor controls

• Play / Pause — lock or resume scrolling.
• Pause on hover — motion stops while the pointer is over the box.

• Vanilla CSS/JS with jx-sb prefix — no jQuery
• Four content sources: text, custom items, category articles, single article
• Four scroll directions with seamless loop cloning
• Five themes with colour and radius controls
• Header / Breaking label
• Play / pause control
• Fade edges and item separators
• Speed in pixels per second and loop gap control
• Pause on hover and focus
• Link target and optional nofollow
• Responsive layout with mobile-friendly tweaks
• Reduced-motion friendly behaviour
• Joomla 4, 5, and 6 ready (services + Dispatcher architecture)

Q: Does Scroll Box Pro still need jQuery?
A: No. Version 2.0 is fully vanilla JavaScript and CSS.

Q: How do I set scroll speed?
A: Use Speed (pixels per second) under Motion. Typical values are 30–80. Higher is faster.

Q: Why is my vertical scroll area short?
A: Set a fixed Height in Look (for example 160px) when using up or down direction.

Q: Can I use multiple messages?
A: Yes. Choose Custom items list and add as many text + link rows as you need.

Q: Can it load Joomla articles?
A: Yes. Choose Articles from categories, or Single article for one piece of content.

Q: Is it responsive?
A: Yes. The module uses max-width: 100% and includes mobile layout tweaks for small screens.

Q: Can I add my own CSS?
A: Yes — use Extra CSS in Advanced, or a Module Class Suffix with your template stylesheet.

The scroll box does not appear

• Confirm the module is Published and assigned to a visible position.
• Check menu assignment for the page you are viewing.
• Clear Joomla cache (System → Clear Cache).
• In page source, search for jx-sb or data-jx-sb.

No content found

• Text: enter content in Scroll text.
• Custom items: add at least one row with text.
• Articles: verify categories have published articles and Count is greater than zero.
• Single article: confirm the selected article is published.

Text is not scrolling

• Check Direction and Speed under Motion.
• Make sure Play is not locked in the paused state.
• Hard-refresh the browser so the latest scroll-box.js loads.
• If prefers-reduced-motion is enabled in the OS, motion stays paused by design.

Vertical scroll looks wrong

• Set a fixed Height (px) in Look.
• Confirm Direction is Up or Down.

Still stuck?

Contact support.joomlax.com with your Joomla version and a screenshot of the module settings.