The news ticker is a multi-functional data display WordPress widget. It allows using posts, pages, landing pages or custom content
For further work, you need the Elementor to be installed on your site. You can download it from wordpress.org
Open or create a page using Elementor and drag the widget to a page using the Element editor to start customizing. In the left pane of the editors, you can customize the widget to the style of your site. Each of the tabs presented a specific group of settings:
Content tab
In the Content section, you can manage the basic settings of the news ticker block such as label, ticker type, speed, etc.
General
Show label
The toggle to enable/disable the display of the label in the news ticker. When the option is enabled the following options are available:
- Hide label on mobile – the toggle to enable/disable the label display on mobile.
- Title – enter the title for the label or use dynamic tags features for this field.
- Label icon – select the label icon from the library or upload your own SVG icon.
- Icon position – select one of the available icon display positions on the label box: Before, After, Above left, Above center, Above right, Under left, Under center, Under right.
- Label alignment – specify the alignment for the label: Left, Right.
- Label text alignment – specify the text alignment for the label box: Left, Center, Right.
Ticker type
Select the news ticker type: Ticker or Slider. When the Ticker is selected further settings are available:
- Ticker speed – select the news speed using the slide.
- Pause ticker on hover – the toggle to enable/disable the pause on hover feature.
- Separator – the toggle to enable/disable the separator for the news items in the ticker. Further options are available for the separator: Separator type(Text, Icon, Date), Separator text.
When the Slider is selected a new Slider section with settings will be available.
Content
The widget provides the ability to use different sources for your news ticker:
Posts
- A set of fields that allow you to filter posts by further parameters: Author, Categories, Tags, Formats, Exclude(specific posts).
- Posts count – specify the number of items to be displayed in the ticker.
- Oder by – select one of the item order types from the provided list.
- Order – select Ascending or Descending order type.
Pages
- A set of fields that allow you to filter pages by further parameters: Author, Exclude(specific pages).
- Posts count – specify the number of items to be displayed in the ticker.
- Oder by – select one of the item order types from the provided list.
- Order – select Ascending or Descending order type.
Landing Pages
- A set of fields that allow you to filter pages by further parameters: Author, Exclude(specific pages).
- Posts count – specify the number of items to be displayed in the ticker.
- Oder by – select one of the item order types from the provided list.
- Order – select Ascending or Descending order type.
Custom
The block for managing the custom news elements. The items can be added, removed, or duplicated.
To add a new element, click “Add Item” and fill all the necessary fields:
- Title – enter the title of the item
- Link – paste the link for the current item
- Date – select publication date using the calendar.
manual
Add posts or pages manually to display them in the news ticker.
- Search – click “+” to add posts to be displayed.
- Posts count – specify the number of items to be displayed in the ticker.
- Oder by – select one of the item order types from the provided list.
- Order – select Ascending or Descending order type.
Slider
The section with settings is available only when the Slider type is selected in the Ticker type.
- Arrows – the toggle to enable/disable the arrow display on the slider. When arrows are enabled, the options to select icons for the previous and next errors and alignment are available.
- Infinite loop – the toggle to enable/disable infinite scrolling of the slider.
- Direction – select the direction of the slider scrolling: Left or Right.
- Items to show – select the number of items to be displayed per screen for different devices.
- Items to scroll – specify the number of items that will be scrolled when navigating.
- Transition speed – specify the speed of slides transition in seconds.
- Switching animation – select Fade or Slide switching navigation. Pick “none” to disable the animation.
Style tab
On the style tab, you can manage the element styles of the news ticker widget like colors in different states, size, typography, borders, padding/margin, etc.
Ticker item
General settings of the ticker.
- Margin – the setting allows managing the margin of the current element in different units(px, %, em) for desktops, tablets, or phones.
- Padding – the setting allows managing the padding of the current element in different units(px, em, %, em) for desktops, tablets, or phones.
- Spacing between slides – specify the space between slides of the carousel in pixels.
- Typography – this group of settings controls everything about typography: font size, font weight, line height, decoration, and other parameters.
NORMAL/HOVER
The item style settings for different states.
- Background Type – the setting changes the background of the current block. You can choose a color, gradient, or background image.
- Border Type – select one of the available border types (solid, double, dotted, dashed, groove) for the current box and adjust the width, color, and radius according to your needs. Pick “None” to remove the border.
- Border Radius – specify the radius of the current block items for all devices or separately for desktops, tablets, or mobiles.
- Box Shadow – the setting creates a shadow from the current block and it can be adjusted according to your needs specifying color, blur, horizontal and vertical shift.
Arrows
- Margin – the setting allows managing the margin of the current element in different units(px, %, em) for desktops, tablets, or phones.
- Padding – the setting allows managing the padding of the current element in different units(px, em, %, em) for desktops, tablets, or phones.
- Arrows size – specify the size of the nav arrows for desktops, tablets, or phones using the slider.
- Space between arrows – specify the space between arrows for desktops, tablets, or phones using the slider.
NORMAL/HOVER
The error style settings for different states.
- Color– specify the font color and opacity of the text using the color picker.
- Background Type – the setting changes the background of the current block. You can choose a color, gradient, or background image.
- Border Type – select one of the available border types (solid, double, dotted, dashed, groove) for the current box and adjust the width, color, and radius according to your needs. Pick “None” to remove the border.
- Border Radius – specify the radius of the current block items for all devices or separately for desktops, tablets, or mobiles.
- Box Shadow – the setting creates a shadow from the current block and it can be adjusted according to your needs specifying color, blur, horizontal and vertical shift.
Separator
- Margin – the setting allows managing the margin of the current element in different units(px, %) for desktops, tablets, or phones.
- Padding – the setting allows managing the padding of the current element in different units(px, em, %) for desktops, tablets, or phones.
- Typography – this group of settings controls everything about typography: font size, font weight, line height, decoration, and other parameters.
NORMAL/HOVER
The separator style settings for different states.
- Color– specify the font color and opacity of the text using the color picker.
- Background Type – the setting changes the background of the current block. You can choose a color, gradient, or background image.
- Border Type – select one of the available border types (solid, double, dotted, dashed, groove) for the current box and adjust the width, color, and radius according to your needs. Pick “None” to remove the border.
- Border Radius – specify the radius of the current block items for all devices or separately for desktops, tablets, or mobiles.
- Box Shadow – the setting creates a shadow from the current block and it can be adjusted according to your needs specifying color, blur, horizontal and vertical shift.
Advanced Tab
The advanced tab allows you to flexibly configure everything that relates to the design of the plug-in wrapper. The settings on this tab are entirely similar to the native Elementor widgets and will be convenient for experienced users of the Elementor. Learn more about Advanced Tab settings from Elmentor’s official documentation.
Save changes
Do not forget to save changes after completing the widget setup. To do this, click on the Update button at the bottom of the page.
