In this documentation, we will discuss the customization of the Marquee widget, brought to you by the Element Pack Pro.

🌀 Marquee Widget – Overview

The Marquee Widget in Element Pack Pro allows you to display scrolling text or content horizontally across your page — creating an eye-catching animation effect perfect for announcements, news tickers, promotions, or highlights.

✨ Key Features

• Smooth Scrolling Effect:
  Create continuously moving text or elements from left to right or right to left.
• Direction Control:
  Choose the scrolling direction — left or right — based on your design need.
• Speed Adjustment:
  Easily adjust scroll speed to make it fast or slow for better readability.
• Pause on Hover:
  Users can hover over the marquee to pause the scrolling for a smoother experience.
• Content Flexibility:
  Add text, icons, or even dynamic post content.
• Style Customization:
  Change typography, colors, and background for complete design freedom.

Activate Marquee Widget

To use the Marquee widget from Element Pack Pro, first, you have to enable the widget. Navigate to the WordPress Dashboard.

1. Go to Element Pack Pro > Core Widgets section.
2. Search by the Widget Name ” Marquee ” and it will appear the.
3. Now Enable the Switcher of the Marquee.
4. Hit the Save Settings button.

Inserting the Marquee Widget

1. Go to the Elementor Editor Panel section.
2. Search the Marquee widget.
3. Drag the widget.
4. Drop it on the editor page.

Content Tab Customizations

Marquee Section

Go to Content > Marquee

Step-1

1. Come to the Marquee section, and find the Marquee Type(Text, and Image) options.
2. Here you can add more Marquee items by clicking the Add Item button.

Step-2

1. Content: Set the Content for the Marquee Items.
2. Link: Set the Link for the content.
3. Color: Choose individual color for the Item. You can set each color for individual items.
4. Background: Set the Background color for the Marquee Text also.

Step-3

1. Image: Set the image for the Marquee text. You can set the Image or Text.
2. Link: Set the link for the Image.

Marquee Option Section

Go to Content > Marquee option

1. Item Spacing: Adjust the gap or distance between individual items.
2. Scroll Speed: Control how fast the items scroll across the marquee.

Direction ( Left , Right )

1. Direction: Set the scrolling direction for the marquee — choose either Left or Right.

Direction ( Top, Bottom )

1. Direction: Choose the scrolling direction — from top to bottom or bottom to top. The content will move accordingly.

3. Pause On Hover: Enable this switcher to pause the scrolling when the mouse hovers over the element.
4. Draggable: Turn this on to allow users to drag and scroll the items manually.
5. Clickable: Enable this option to make the scrolling items clickable, allowing interaction while they move.

Offset & Rotate

1. Offset & Rotate: Enable the switcher to activate the offset and rotation features for the element.
2. Rotate: Adjust the rotation angle in degrees — the element will rotate based on the value you set.

3. Offset Left: Adjust the horizontal spacing from the left side to position the element accurately within the layout.

4. Offset Right: Adjust the horizontal spacing from the right side to precisely position the element within the layout.

8. Shadow Mode: Toggle this switch to enable or disable shadow effects for the icons or items.
9. Shadow Color: Choose the desired color for the shadow to enhance the visual depth and highlight the elements.

Work with The Style Tab

Marquee Section

Go to Style > Marquee

Normal Tab

1. Text Color: Select the color for the Text of the Marquee tag.
2. Background Type: Choose the background color for the text. It will set the global color for all the items. But if you select the background before it will not work for you.
3. Border Type: Choose the type for the Border.
4. Border Width: Set the width for the border.
5. Border Color: Choose the color for the border.

6. Border Radius: Make the border corner radius for the edges.
7. Padding: Make the padding for the inner spaces.

8. Typography: Choose the typography for the marquee.
9. Text Stroke: Select the stroke for the marquee.
10. Text Shadow: Make a shadow for the Text.

Hover Tab

1. Text Color: Choose the color of the Text. It will hover over the text.
2. Background Type: Choose the Background type for the Color. Select the color.
3. Border Color: Set the border for the Color.

Icon Section

Go to Style > Icon

1. Size: Set the size for the Icon. Adjust the size according to needs.
2. Space Between: Make the space between the Icon and Text.

Normal Tab

3. Color: Set the color for the icon.

Hover Tab

1. Color: Choose the color for the Icon. It will appear on hover over the Icon.

Video Assist

You can watch the quick video to learn about the Marquee widget. Please visit the demo page for examples.

Thanks for being with us.