Anything Carousel Widget

The SiteOrigin Anything Carousel Widget displays images, text, or any other content in a carousel.

Requirements

To make use of this widget, go to PluginsSiteOrigin Widgets to activate the SiteOrigin Anything Carousel Widget.

The Anything Carousel Widget is ready to be used anywhere:

Page Builder: Insert widgets in Page Builder by SiteOrigin in either the Classic Editor or Page Builder Layout Block in the Block Editor.
Block Editor: 100% Block Editor compatible. Insert widgets using the SiteOrigin Widgets Block featuring a live widget search form.
Theme and Plugin Widget Areas: Insert widgets into any theme or plugin widget area.

Settings

Title
Optionally enter a widget title.

Items

Here you’ll add your carousel items which consist of a title and a content area. Use the Add button to add as many items as you need in your carousel. On the right of each item, you’ll find three icons. The down arrow opens the item, the page icon duplicates the item and the cross icon deletes the item.

Within each item you’ll find the following fields:

Title
Optionally set an item title.

Content Type
By default, a text field will be available for your item content. If you’re using SiteOrigin Premium and have the Carousel addon enabled you’ll also be able to select a Layout Builder. A Layout Builder is an instance of Page Builder, this means you build a layout consisting of columns and rows and add any widget you’d like, within the item content area.

If you’d like to process shortcodes in the content field, select the Layout Builder option and insert a SiteOrigin Editor which will output the shortcode.

Settings

Loop Items
Automatically return to the first item after the last item.

Navigation Dots
Display navigation dots below the carousel items.

Animation

Choose between Ease or Linear animation effects.

Animation Speed
Set the carousel animation speed. Defaults to 800 milliseconds.

Autoplay
Enable to scroll the carousel without user interaction.

Autoplay Pause On Hover
Displayed if Autoplay is enabled. If enabled the carousel will pause on hover.

Timeout
Set the autoplay timeout. Defaults to 8000 milliseconds.

Use Item Anchor Tags in the URL
Enable to add carousel item anchor tags in the allow. Anchor tags allow linking to specific carousel items. This setting is included in the SiteOrigin Premium Carousel Addon.

Carousel Anchor
Optionally set a custom anchor tag. Required if the widget title field is empty.

Design

Item Title

HTML Tag
Set the item title HTML tag. Defaults to h4.

Font
Set the item title font family.

Font Size
Set the item title font size.

Color
Set the item title text color.

Bottom Margin
Set the item title bottom margin. Defaults to 24px.

Item

Font
Set the item text font family.

Font Size
Set the item text font size.

Color
Set the item text color.

Margin
Set the item margin. Defaults to Top:0px Right:12px Bottom:64px Left:12px.

Navigation

Arrows Color
Set the navigation arrows color. Defaults to #626262.

Arrows Hover Color
Set the navigation arrows hover color. Defaults to #000000.

Arrows Margin
The space between the navigation arrows and items.

Dots Color
Set the navigation dots color. Defaults to #bebebe.

Dots Selected and Hover Color
Set the navigation dots selected and hover color. Defaults to #f14e4e.

Responsive

Desktop

Slides to Show
The number of slides to show on desktop.

Display Navigation Arrows
Enable to display the navigation arrows on desktops.

Tablet

Landscape

Breakpoint
The pixel resolution at which the tablet landscape settings are applied. Defaults to 1366px.

Slides to Show
The number of slides to show on tablet devices in landscape view.

Display Navigation Arrows
Enable to display the navigation arrows on tablet devices in landscape view.

Portrait

Breakpoint
The pixel resolution at which the tablet portrait settings are applied. Defaults to 1025px.

Slides to Show
The number of slides to show on tablet devices in portrait view.

Display Navigation Arrows
Enable to display the navigation arrows on tablet devices in portrait view.

Mobile

Breakpoint
The pixel resolution at which the mobile settings are applied. Defaults to 480px.

Slides to Show
The number of slides to show on mobile devices.

Display Navigation Arrows
Enable to display the navigation arrows on mobile devices.

Global Settings

The following default settings apply to all Anything Carousel Widgets and can be adjusted at PluginsSiteOrigin WidgetsAnything Carousel: Settings.

Responsive

Desktop

Slides to Show
The number of slides to show on desktop.

Display Navigation Arrows
Enable to display the navigation arrows on desktops.

Tablet
Landscape

Breakpoint
The pixel resolution at which the tablet landscape settings are applied. Defaults to 1366px.

Slides to Show
The number of slides to show on tablet devices in landscape view.

Display Navigation Arrows
Enable to display the navigation arrows on tablet devices in landscape view.

Portrait

Breakpoint
The pixel resolution at which the tablet portrait settings are applied. Defaults to 1025px.

Slides to Show
The number of slides to show on tablet devices in portrait view.

Display Navigation Arrows
Enable to display the navigation arrows on tablet devices in portrait view.

Mobile

Breakpoint
The pixel resolution at which the mobile settings are applied. Defaults to 480px.

Slides to Show
The number of slides to show on mobile devices.

Display Navigation Arrows
Enable to display the navigation arrows on mobile devices.