Demo
HubSpot Scrolling Content Banner Module
Available on the HubSpot Marketplace
#tickertape #marquee #scrollingtext
The HubSpot Scrolling Content Banner Module
Features:
- Can be used on any HubSpot website. Automatically adapts to the styling of any HubSpot Theme you're using, whether it's from the Marketplace or custom built.
- Highly Customizable. Don't like the default styling? Customize it! Read below for more details on all the customization options available.
Module Live Demo
The Scrolling Content Banner module can be added to any HubSpot theme and will automatically adapt to your website's styling. Below is a live example of what the module first looks like when added to this particular theme.
Note that, to get the edge-to-edge effect, you'll want to drag it into a new section, set it to "Full Width" and remove any left and right spacing.
Logo Banners
The example below consists of two separate modules which swap out the text for images, remove the separator, set a background colour, corner radius and spacing on each item and adjust the animation speed. On the second module, the animation direction is adjusted as well.
Text Banners
The example below consists of three separate modules which use text, remove the separator, add spacing and a border to the banner and adjust the animation speed and direction.
Skewed Banners
The example below uses a custom image separator, adds a background colour and spacing to the banner, colour and spacing between items and skews it slightly.
Image Gallery Banners
The example below replaces text with images and removes the separator.
Configuration Options
Below is a list of all the customization options available for the Scrolling Content Banner module.
Content:
- Items (repeater, add as many as you need!)
- Content (rich text)
- Link (link)
- Separator
- Type (choice) - Choose between Icon, Image, Text or None
- Icon (icon)
- Height (number)
- Image (image)
- Text (text)
- Advanced
- Custom CSS Class
- Custom CSS
Styles:
- Banner
- Border
- Border
- Background
- Color
- Spacing
- Spacing
- Transform
- Skew
- Border
- Items
- Background
- Color
- Border
- Border
- Corner
- Radius
- Spacing
- Spacing
- Spacing Between Items
- Text
- Font
- Color (On Hover)
- Background
- Separator
- Fill
- Color
- Text
- Font
- Spacing
- Spacing
- Fill
- Animation
- Pause on Hover
- Speed
- Direction