The Post Hover List widget by Atomic Addons shows posts as a text list with one image frame beside it. The frame starts with the first post's featured image, and when a visitor points at another post, that post's image fades in. Each post shows its date, title and a meta line with category, author and reading time. This guide covers adding the widget, choosing the posts and setting up the list.
Enable the Post Hover List Widget
Post Hover List 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 Hover List. You can also open the Posts / Dynamic category.
- 4
Turn the Post Hover List widget on.
- 5
Click Save Settings.
Add the Post Hover List Widget
Post Hover List works on any page, post or saved template:
- 1
Open the page in Elementor (Edit with Elementor).
- 2
In the widget panel, search for Post Hover List. 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
Row Gap: The space between posts.
- 2
Image Direction: Which side the image frame sits on: Right (the default) or Left.
- 3
Alignment: Left, center or right alignment of the text. Use the device icon to set it per screen size.
- 4
Image Resolution: Which image size WordPress serves. Medium by default; the frame is fairly large, so Large often looks sharper.
The hover effect runs on tablets and desktops (768px and wider), where the list takes about 60% of the width and the image frame the rest. On screens 1024px and wider each post's date sits in its own column to the left of the title. On phones each post shows its own image under its text.
Query
Content → Query decides which posts appear:
- 1
Item Limit: How many posts to show, from 1 to 20. 3 by default. With Show Pagination on, it is the number per page.
- 2
Source: Which posts to pick from. The list has your public post types, such as Posts (the default), Pages and, with WooCommerce, Products, followed by three special sources. Manual Selection shows only the posts you search for and pick in Search & Select; they can be of any post type. Current Query shows the posts of the page being viewed — a blog, category, tag, author or search results page — which is what an archive template needs; the editor may not show them until you save and reload. Related shows, on a single post, other posts of the same type by the same author; narrow it with Include By → Terms, and add Exclude By → Current Post to leave out the post itself.
- 3
Include / Exclude: Two tabs, hidden for Manual Selection and Current Query. Include By keeps only posts by the Authors you pick or in the Terms you pick (categories, tags, formats or custom taxonomy terms). Exclude By leaves out Authors, Terms, posts you pick with Manual Selection (in its own Search & Select field) or the Current Post.
- 4
Offset: Skips this many posts from the start of the list. 0 by default.
- 5
Date: All (the default), or only posts published in the Past Day, Past Week, Past Month, Past Quarter or Past Year. Custom adds a Before and an After date; both are inclusive.
- 6
Order By: Title, ID, Date (the default), Author, Comment Count, Menu Order, Last Modified or Random.
- 7
Order: DESC (the default) puts the newest or highest first; ASC reverses it.
- 8
Ignore Sticky Posts: With the Posts source only. On by default, so sticky posts keep their normal place instead of jumping to the top.
Only Featured Image Post leaves out posts without a featured image. Query ID is for developers: it gives the query a name that custom code can hook into through the atomel/query/{your-id} action.
The section also has a Limit field (6 by default). This widget does not use it: the number of posts comes from Item Limit at the top of the section.
With Current Query the page's own query decides which posts show and in what order, so the filters, Offset and order settings are hidden. Current Post works with the Related source, and with the Posts source while Ignore Sticky Posts is on.
Additional
Content → Additional picks what each post shows:
- 1
Show Image: The image frame. Turn it off for a plain text list. On by default.
- 2
Title: The post title, linked to the post. On by default.
- 3
Title HTML Tag: The title's markup: H1 to H6, div, span or p. H3 by default.
- 4
Show Category: The post's categories, at the start of the meta line under the title. On by default.
- 5
Show Author: The author's name, linked to their posts. On by default.
- 6
Separator: The character printed between the meta items, “·” by default.
- 7
Date: The publish date. On by default.
- 8
Human Different Time: Shows the date as elapsed time, such as “3 days ago”, instead of the date itself.
- 9
Time Short Format: With Human Different Time on: shortens it, such as “5h ago” or “3d ago”.
- 10
Show Time: With Human Different Time off: adds the publish time, with a clock icon, after the date.
- 11
Reading Time: An estimate such as “3 min 20 sec read”, worked out from the post's word count. Off by default.
- 12
Reading Speed: The words per minute the estimate assumes, 200 by default.
- 13
Show Pagination: Page numbers under the widget, with previous and next arrows; the current page is highlighted. They appear only when there is more than one page. Off by default.
- 14
Item Wrapper Link: Makes the whole item clickable, opening its post in the same tab. Off by default.
The date sits above the title (beside it on wide screens); the category, author and reading time follow the title on one line.
Style the Post Hover List
Everything below is on the Style tab. Sections that belong to a part you turned off are hidden.
- Items — the space between posts and the Divider Color and Divider Width of the line under each one.
- Image — spacing, border, border radius and Height of the image frame.
- Title — a hover line Style (Underline, the default, Middle Underline, Overline or Middle Overline), color, hover color, spacing, typography and text shadow.
- Date — color, background, border, border radius, padding, spacing and typography.
- Author — color, hover color, space between, separator color and typography.
- Category — color, background, border, border radius, padding, space between and typography in Normal and Hover tabs.
- Pagination — alignment and the page numbers' look, when pagination is on.
Can't find what you need?
Our support team can help with setup questions and anything the docs don't cover yet.