Page Builder 
Widgets Bundle 
SiteOrigin CSS 
Installer Post Carousel
5 min read Updated
The Post Carousel widget shows posts in a carousel. Each item shows the post’s featured image and title. You choose the posts with a query, and the carousel loads more posts as visitors move through it.
Requirements
The Post Carousel widget is active by default. If it is not, go to PluginsSiteOrigin Widgets and activate Post Carousel.
You can use the Post Carousel widget in three places:
Page Builder: Add the SiteOrigin Post Carousel widget to a Page Builder layout in the Classic Editor or in the SiteOrigin Layout block.
Block Editor: Add the SiteOrigin Post Carousel block. It is in the SiteOrigin category of the block inserter.
Widget areas: Add the widget to any theme or plugin widget area.
Settings
Title
An optional title above the carousel. With the default theme, the arrows show next to it.
Default Thumbnail
The image to show for posts that have no featured image.
Featured Image Size
The image size for the thumbnails. It also sets the size of each item. Default: Sow Carousel Default (272×182).
Link Target
Open posts in the Same window or a New window. Default: Same window.
Settings
Loop Items
Return to the first post after the last post. Default: on.
Navigation Arrows
Show previous and next arrows. Hidden when Autoplay is Continuous. Default: on.
Animation
The transition effect: Ease or Linear. Default: Ease.
Animation Speed
The length of the transition, in milliseconds. Default: 400.
Autoplay
Off, On or Continuous. Default: Off.
- Off: visitors move the carousel with the arrows or by swiping.
- On: the carousel moves automatically after each Timeout.
- Continuous: the carousel scrolls without stopping and has no arrows. Choosing it sets Animation to Linear, Animation Speed to 8000, Timeout to 400 and turns on Autoplay Pause on Hover. In this mode, Animation Speed sets how fast the posts move. The carousel always pauses on hover and doesn’t use Timeout.
Autoplay Pause on Hover
Pause autoplay while the pointer is over the carousel. Appears when Autoplay is On or Continuous. Default: off.
Timeout
The time between moves, in milliseconds. Appears when Autoplay is On or Continuous. Default: 8000.
Posts Query
Click Posts Query to open the query settings.
Post Type
The post types to show. Default: Posts.
Post In
Show only the posts you choose. Click the field to search for posts.
Taxonomies
Show only posts in the categories, tags or other terms you choose.
Taxonomies Relationship
OR shows posts in at least one of the terms. AND shows posts in all of the terms. Default: OR.
Date Selection Type
Specific dates or dates Relative to today. Default: Specific.
Dates
The date range for the posts.
Order By
Default: Published date.
Order Direction
Ascending or Descending. Default: Descending.
Posts Per Load
The number of posts the carousel loads at a time. It loads more when visitors reach the end. Default: 10.
Maximum Posts to Output
The total number of posts the carousel shows. Leave it empty for no limit.
Sticky Posts
Default, Ignore sticky, Exclude sticky or Only sticky.
Additional
Extra WordPress query arguments, for advanced users.
Design
Post Thumbnail
Thumbnail Overlay Hover Color
The color over the thumbnail on hover. Default: #3279bb.
Thumbnail Overlay Hover Opacity
From 0 to 1. Default: 0.5.
Post Title
HTML Tag
H1 to H6, or Paragraph. Default: H3.
Font
Default: Use theme font.
Font size
The post title size.
Color
The post title color.
Navigation
Arrow Color
Default: #fff.
Arrow Hover Color
The arrow color on hover.
Background
The arrow button background. Default: #333.
Hover Background
The arrow button background on hover. Default: #444.
Responsive
These settings control how many posts scroll on each device. The number fields show the default value in grey. Leave a number field empty to use it.
Each device group has these settings:
- Breakpoint (Tablet and Mobile only): the screen width, in pixels, for that device group.
- Slides to Scroll: the number of posts to move for each arrow click or swipe.
- Navigation Arrows: show the arrows on this device. Appears when Settings > Navigation Arrows is on.
The device groups and their defaults are:
- Desktop: screens at or above the Tablet Landscape breakpoint. Portrait screens between the Portrait and Landscape breakpoints also use the Desktop Slides to Scroll and Slides to Show. Slides to Scroll 1. Arrows on.
- Tablet > Landscape: screens between the Portrait and Landscape breakpoints, in landscape orientation. Breakpoint 1366, Slides to Scroll 2. Arrows on.
- Tablet > Portrait: screens between the Mobile and Portrait breakpoints. Breakpoint 1025, Slides to Scroll 2. Arrows on.
- Mobile: screens narrower than the Mobile breakpoint. Breakpoint 480, Slides to Scroll 1. Arrows off.
The number of posts in view depends on the Featured Image Size and the width of the carousel.
At the moment, the per-device Navigation Arrows settings use the default tablet breakpoints (1366 and 1025) to hide arrows, even if you change the tablet Breakpoint values.
Global Settings
The Post Carousel widget has a Settings button at PluginsSiteOrigin Widgets with a Responsive section. At the moment, the widget doesn’t use these global values. Set the Responsive values in each widget instead.
SiteOrigin Premium
SiteOrigin Premium adds these features to the Post Carousel widget with the Carousel addon:
- A Theme setting at the top of Design: Default or Overlay. Overlay shows the post category and title over the thumbnail, and puts the arrows and dots below the carousel. Premium also moves Post Title above Post Thumbnail in Design.
- With the Overlay theme, more settings appear: Navigation Dots in Settings; Thumbnail Overlay Color and Border Radius in Design > Post Thumbnail; a Category section in Design with Color, Font Size and Background Color; Dots Color, Dots Selected and Hover Color and Navigation Top Margin in Design > Navigation; and Slides to Show and Navigation Dots in each Responsive device group. Overlay hides Thumbnail Overlay Hover Color, Thumbnail Overlay Hover Opacity, Background and Hover Background.
- A separate Post Carousel Cards widget that shows posts as cards.
