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

Marquee Type: Text

1. Marquee Type: Choose the marquee type text. It will demonstrate only the Text for the marquee.

2. Content: Choose the content for the marquee.
3. Link: Set the link for the marquee section.
4. Icon: Choose the icon for demonstrating before the Icon.

5. Color: Select the color for the marquee text.
6. Background Color: Choose the background color for the marquee tag.

7. Now click on the ” + Add Item ” button to add new items for the marquee.

Marquee Type: Image

1. Marquee Type: Choose the marquee type image. It will demonstrate the image for the marquee.
2. Image Resolution: Select the resolution for the Image. The image quality depends on it.

3. Image: Select the image from the marquee section and choose the images.
4. Link: Set the link for the Image.
5. Width: Set the width for the Marquee images.

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.
3. Direction: Set the scrolling direction for the marquee — choose either Left or Right.

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

Offset & Rotate

7. Offset & Rotate: Enable the switcher to activate the offset and rotation features for the element.
8. Rotate: Adjust the rotation angle in degrees — the element will rotate based on the value you set.
9. Offset Left: Adjust the horizontal spacing from the left side to position the element accurately within the layout.
10. Offset Right: Adjust the horizontal spacing from the right side to precisely position the element within the layout.

11. Shadow Mode: Toggle this switch to enable or disable shadow effects for the icons or items.
12. Shadow Color: Choose the desired color for the shadow to enhance the visual depth and highlight the elements.
13. Shadow Color: Choose the color for the Shadow.
14. Width: Set the width of the shadow.

15. Show on Mobile: Enable the switcher to show the shadow on the Mobile.

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.