How to use Ultra Carousel Widget of Sky Addons for Elementor
Ultra Carousel is a bold, image-forward Elementor post carousel widget that overlays your post content on the featured image for a striking magazine look. Each slide can show the category, author, date, title with its own background, an excerpt, and a customizable Read More button with icon. Powered by a flexible Query builder and full Swiper carousel controls — autoplay, loop, navigation arrows, and pagination — the Ultra Carousel widget for Elementor turns your latest posts into a hero-style slider. This documentation will guide you through the process of using the Ultra Carousel Widget on your website.
Features:
- Powerful Query Builder: Pull posts from any post type and filter by terms, authors, include/exclude rules, date, order, and offset.
- Read More Button: Custom button text, icon, icon position, and icon spacing — fully styleable.
- Image Overlay & Title Background: Gradient overlay over the featured image plus a dedicated title background for readable overlaid text.
- Responsive Columns: Show 1 to 6 slides per view with separate defaults for desktop, tablet, and mobile.
- Rich Post Elements: Toggle the title, category, author, date, excerpt, and read more button independently, with a configurable text limit.
- Video Support: Video posts get a play button and can open in a lightbox with aspect ratio, autoplay, and mute options.
- Full Carousel Control: Autoplay, loop, slide speed, pause on hover, centered slides, free mode, grab cursor, and transition effects including coverflow.
- Navigation & Pagination: Prev/next arrows with custom icons plus bullets, fraction, or progress bar pagination.
Insert Ultra Carousel Widget
- Open Elementor Editor. In the Elementor panel, search for “Ultra Carousel” under Sky Addons.
- Drag and Drop the Widget to the desired location on your page / editor.
Configure Layout
Start in the Layout section to define the basic shape of your carousel:
- Columns: Choose how many slides are visible at once (1–6). Set different values for desktop, tablet, and mobile.
- Alignment: Align the post content left, center, right, or justified per breakpoint.
Build the Post Query
The Query section decides which posts appear in your Elementor post carousel. It works like a mini query builder:
- Source: Select the post type to display — Posts, Pages, or any registered custom post type.
- Limit: Set how many posts the carousel loads.
- Include / Exclude: Hand-pick posts to include or exclude, or filter by Terms (categories, tags, taxonomies) and Authors.
- Offset: Skip a number of posts from the start of the results.
- Date: Restrict posts to a time range such as past week, month, year, or a custom before/after window.
- Order By / Order: Sort by date, title, menu order, random, and more — ascending or descending.
- Ignore Sticky Posts: Decide whether sticky posts keep their priority position.
Configure Additional Options
The Additional section toggles each post element on or off:
- Show Title: Display the post title, with a Title HTML Tag selector (H1–H6, div, span, p) for SEO-friendly markup.
- Show Category: Display the post’s category badges.
- Show Author: Display the author name linked to the author archive.
- Show Text: Display an excerpt, with a Text Limit (word count) and a Strip ShortCode switch to keep raw shortcodes out of the excerpt.
- Show Date: Display the publish date, with Human Diff Time (e.g. “3 days ago”), a short-format option, and an optional time display.
- Show Video: Detect video posts and show a play button on the thumbnail.
- Show Read More: Display a Read More button on each slide.
Configure the Read More Button
When Show Read More is enabled, the Read More section appears:
- Button Text: Change the label (e.g. “Read More”, “Continue Reading”).
- Icon: Pick any icon from the icon library to accompany the text.
- Icon Position & Icon Spacing: Place the icon before or after the text and fine-tune the gap.
Configure Video Settings
When Show Video is enabled, the Video Settings section controls how videos open:
- Video Open: Open the video in a Lightbox or follow the post link, with an optional new-tab setting for file links.
- Entrance Animation & Aspect Ratio: Choose the lightbox animation and the video ratio (16:9, 4:3, etc.).
- Lazy Load, Autoplay, Mute: Fine-tune playback behavior inside the lightbox.
Configure Carousel Settings
The Carousel Settings section gives you full control over the slider motion:
- Height: Set a fixed carousel height per breakpoint, or leave it automatic.
- Item Gap: Control the space between slides.
- Autoplay & Autoplay Speed (ms): Auto-advance slides at your chosen interval, with Pause On Hover.
- Loop: Make the carousel cycle endlessly.
- Slide Speed (ms): Set the transition duration between slides.
- Transition Effect: Slide or Coverflow, with depth, rotate, stretch, and slide shadow options.
- Slides Per Group, Centered Slides, Grab Cursor, Free Mode: Advanced behaviors for how slides move and respond to dragging.
Configure Navigation and Pagination
- Navigation: Toggle Show Navigation and choose custom Prev / Next icons from the icon library.
- Pagination Type: Choose Bullets, Fraction, or Progress Bar, with a Dynamic Bullets option and progress bar position control.
- Alignment: Align pagination left, center, or right.
Style Your Ultra Carousel
Head to the Style tab to make the carousel match your brand. Every element has its own dedicated section:
- Ultra Carousel (Item):
Set padding, border, border radius, and box-shadow for each slide. - Image:
Add a gradient Image Overlay to keep overlaid text readable, plus border, border radius, and box-shadow. - Title:
Adjust spacing, padding, colors, typography, and a dedicated Title Background behind the headline. - Text:
Style the excerpt color and typography. - Category:
Adjust spacing, space between badges, colors, background, and typography in normal and hover states. - Meta:
Style the author and date row — spacing, space between items, color, and typography. - Read More:
Style the button text, icon, padding, background, border, and hover state. - Play Button:
Customize the video play button size, color, background, border, and hover state. - Navigation & Pagination:
Position the arrows precisely, style their size, color, background, and border, and customize bullet size, spacing, radius, and active colors.
These styling options let you shape the Ultra Carousel into a dramatic, hero-style post slider that fits any design system.
Save and Preview
- Once you’ve customized and styled your carousel, click “Publish” or “Update” to save your changes.
- Preview the page to ensure the widget looks and functions as desired.
Best Practices
- Consistency: Use high-resolution featured images, since the Ultra Carousel design puts the image front and center.
- Accessibility: Keep the Image Overlay dark enough that the overlaid title and meta stay readable.
- Clear Call to Action: Keep the Read More button label short and style it with a strong hover state.
- Testing: Check the carousel height and columns on tablet and mobile breakpoints.
Troubleshooting
- No Posts Showing: Check the Query section — the selected source, terms, or date filters may exclude everything. The widget renders nothing when the query finds no posts.
- Text Hard to Read on Images: Strengthen the Image Overlay gradient or the Title Background in the Style tab.
- Carousel Not Sliding: Ensure JavaScript is enabled and no other plugin loads a conflicting Swiper version; clear cache after changes.
Frequently Asked Questions
How do I add a Read More button to the Ultra Carousel slides?
Switch on Show Read More in the Additional section. A Read More section then appears where you can set the button text, choose an icon, and control the icon position and spacing. The Style tab has a matching Read More section for colors and hover effects.
How do I keep the title readable over the featured image?
Use the Image Overlay gradient in the Image style section, or give the headline its own Title Background in the Title style section. Both keep overlaid text legible on busy photos.
How do I choose which posts the Ultra Carousel displays?
Use the Query section. Select a Source (post type), then filter with Include/Exclude rules, Terms, Authors, a date range, and ordering. The Limit option controls how many posts load into this Elementor post carousel.
Can I make the Ultra Carousel autoplay and loop?
Yes. In Carousel Settings, switch on Autoplay with your preferred Autoplay Speed and enable Loop for continuous cycling. Pause On Hover keeps slides readable.
Does the Ultra Carousel support video posts?
Yes. With Show Video enabled, posts containing a video get a play button overlay, and the Video Settings section lets the video open in a lightbox with aspect ratio, autoplay, and mute options.
Related Documentation
Conclusion
The Ultra Carousel Widget by Sky Addons for Elementor delivers a bold, image-first post slider with overlay styling and a built-in Read More button. Utilize its customizable features to create a seamless user experience. For further assistance, consult the Sky Addons support team or community forums. Enjoy building striking content sliders!