The Post Stories Slider widget by Atomic Addons shows one post at a time as a large slide. The featured image fills the slide, with the category, title and author over it. Slides fade from one to the next. A strip of thumbnails in the bottom corner lets visitors jump to any post. On wide screens, a Top Stories panel can list three more posts at the side. This guide covers adding the widget, setting up the slides and the Top Stories panel, and choosing the posts.
Enable the Post Stories Slider Widget
Post Stories Slider is a Pro widget and needs Atomic Addons Pro. Switch it on from the plugin dashboard:
- 1
Go to WordPress Dashboard → Atomic Addons.
- 2
Click the Widgets tab.
- 3
Search for Post Stories Slider. You can also open the Posts / Dynamic category.
- 4
Turn the Post Stories Slider widget on.
- 5
Click Save Settings.
Add the Post Stories Slider Widget
Post Stories Slider works on any page. It fits best in a full-width section at the top of a blog or magazine home page:
- 1
Open the page in Elementor (Edit with Elementor).
- 2
In the widget panel, search for Post Stories Slider. The widget sits in the Atomic Addons Pro category.
- 3
Drag it into the page and set it up with the controls below.
- 4
Click Publish (or Update).
Layout
Open the widget and go to Content → Layout:
- 1
Height: The height of the slides, in px or vh. If you leave it empty, the height adjusts to the screen width, between about 460px and 700px.
- 2
Content Max Width: How wide the text block over the image can get, in px, vw or %.
- 3
Alignment: Left, center or right alignment of the text block.
- 4
Image Resolution: Which image size WordPress serves for the slides and the thumbnails. Full by default. Posts without a featured image show a placeholder.
- 5
Title: The post title, linked to the post. On by default.
- 6
Title HTML Tag: The title's markup: H1 to H6, div, span or p. H3 by default.
- 7
Show Category: The post's categories, above the title. On by default.
- 8
Separator: The character between the date, the comment count and the reading time,
·by default. - 9
Date: The publish date, under the author's name. On by default. Human Different Time shows the age instead, such as “3 days ago”, and Time Short Format shortens hours, minutes and seconds. Without it, Show Time adds the publish time.
- 10
Reading Time: An estimate such as “2 min 30 sec read”. Off by default. Reading Speed sets the words per minute, 200 by default.
- 11
Show Comments: The comment count, such as “3 Comments”. On by default.
- 12
Show Top Stories: The Top Stories panel. On by default. See Top Stories.
Each slide always shows the author's avatar and name above the date.
The thumbnail strip shows two posts at a time, and three on screens 1024px and wider. Post titles appear under the thumbnails from 768px. Clicking a thumbnail opens that slide, and the strip follows the main slider.
Top Stories
With Show Top Stories on, a panel headed “Top Stories” lists three posts, each with a small image, its date and its title. The panel only shows on screens 1024px and wider, at the right of the slider.
- Leave Select Posts empty to list the three most commented posts of the type picked under Query → Source.
- Pick posts in Select Posts to list them instead. The panel shows up to three, newest first.
Without picked posts, the panel needs a post type as its Source. With Manual Selection, Current Query or Related, pick its posts in Select Posts.
The dates in the panel follow the Human Different Time and Show Time settings.
Query
Content → Query decides which posts become slides:
- 1
Item Limit: How many posts the slider holds, 1 to 20. 12 by default.
- 2
Source: Posts is the default. You can also pick Pages or any other public post type on your site. Manual Selection shows only the posts you search for and pick under Search & Select. Current Query shows the posts of the page being viewed, such as a category archive or search results. The editor may not show them until you save and reload. Related works on a single post: it shows posts of the same type by the same author.
- 3
Limit: A number field, 6 by default. Item Limit above takes its place, so set the number of posts there.
- 4
Include / Exclude: Include By keeps only posts in the Terms you pick (categories, tags, formats or custom taxonomies) or by the Authors you pick. Exclude By leaves out terms, authors, the Current Post or posts you pick with Manual Selection.
- 5
Offset: Skips this many posts from the start of the list. 0 by default.
- 6
Date: All (the default), or only posts from the past day, week, month, quarter or year. Choose Custom to set a Before and an After date.
- 7
Order By: Date (the default), Title, ID, Author, Comment Count, Menu Order, Last Modified or Random.
- 8
Order: DESC (the default) shows the newest posts or the highest values first. ASC reverses the order.
- 9
Ignore Sticky Posts: Posts source only. Keeps sticky posts in their normal place instead of putting them first. On by default.
Only Featured Image Post leaves out posts without a featured image, which is useful because the image fills the slide. Query ID is for developers: it gives the query a name that custom code can filter.
With Current Query, the page's own query decides which posts show and in what order. The include, exclude, date and order settings are hidden.
Slider Settings
Content → Slider Settings controls how the slides change. Visitors can also swipe or drag, or click a thumbnail.
- 1
Autoplay: Moves to the next slide by itself. On by default.
- 2
Autoplay Speed: How long each slide stays, in milliseconds. 5000 (5 seconds) by default.
- 3
Pause on Hover: Stops autoplay while the pointer is over the slider. Off by default.
- 4
Grab Cursor: Shows a hand cursor over the slides, a hint that they can be dragged.
- 5
Loop: Starts again from the first post after the last one. On by default. It applies to the thumbnail strip too.
- 6
Animation Speed (ms): How long the fade takes, 500 by default.
- 7
Observer: Turn it on when the slider sits in a tab, an accordion or a popup that is hidden when the page loads.
Style the Post Stories Slider
Everything below is on the Style tab. Sections that belong to a feature you turned off are hidden.
- Items — padding and margin of the text block over the image.
- Title — color, hover color, background, radius, padding, spacing, typography, text shadow and text stroke.
- Meta — color, hover color, space between, separator color, and separate typography for the author and for the date and comments.
- Category — the category labels in Normal and Hover states.
- Thumbs — the thumbnail images (radius, margin) and their titles (color, margin, typography).
- Top Stories — the panel's Glassmorphism blur, background, border, radius and padding, the header text and divider, and the image, date and title of each story.
If no post matches the query, the widget shows nothing.
Can't find what you need?
Our support team can help with setup questions and anything the docs don't cover yet.