Sky Addons for Elementor

⌘K
  1. Home
  2. Sky Addons for Elementor
  3. Widgets
  4. Mate List

Mate List

How to use Mate List Widget of Sky Addons for Elementor

Mate List is a clean blog post list widget for Elementor that displays your posts in a horizontal card layout across 1 to 4 columns. Posts are pulled automatically through the built-in Query builder and shown with featured image, category, title, excerpt, author, and date — plus an optional video play button that opens a lightbox and classic numbered pagination for browsing archives. The Mate List widget for Elementor is ideal for blog pages, news sections, and “latest articles” blocks. This documentation will guide you through the process of using the Mate List Widget to present your posts on your website.

Features:

  1. Three Layouts: Choose Default, Layout 1, or Layout 2 for the post card arrangement.
  2. Responsive Grid: 1 to 4 columns with separate row and column gaps per device.
  3. Query Builder: Filter by post type, terms, authors, and order, with a posts-per-page limit.
  4. Post Elements On/Off: Toggle title, image, category, author, excerpt, and date individually.
  5. Video Lightbox: Posts with a video link show a play button that opens the video in a lightbox.
  6. Pagination: Optional numbered pagination so visitors can page through all posts.
  7. Full Styling: Dedicated style sections for the item, image, title, text, category, meta, author, pagination, and play button.

Insert Mate List Widget

  1. Open Elementor Editor. In the Elementor panel, search for “Mate List” under Sky Addons.
  2. Drag and Drop the Widget to the desired location on your page / editor.

Configure Layout

  1. Select Layout: Pick Default, Layout 1, or Layout 2 to change the post card arrangement.
  2. Columns: Display posts in 1–4 grid columns, set per device.
  3. Row Gap / Column Gap: Control the spacing between cards, responsive per device.
  4. Image Size: Choose the thumbnail size used for featured images.
  5. Alignment: Align card content left, center, right, or justified.

Build the Query

The Query section decides which posts appear in the list. Select the source post type, include or exclude terms and authors, set the order, and limit results with Posts Per Page (default 6). The list updates automatically as you publish new content.

Configure Additional Options

  1. Show Title: Toggle post titles and choose the Title HTML Tag.
  2. Show Image: Toggle the featured image.
  3. Show Category: Toggle the post category badge.
  4. Show Author: Toggle the author name and avatar.
  5. Show Text: Toggle the excerpt, cap it with Text Limit (0 shows the full text), and clean it with Strip ShortCode.
  6. Show Date: Toggle the post date with the standard date format options.
  7. Show Video: Show a play button on posts that have a video link, enabling the Video Settings section (lightbox autoplay, mute, aspect ratio, animation, or open as file).
  8. Show Pagination: Add numbered pagination below the list so visitors can browse older posts.

Style Your List

Customize every element of the post cards to match your design aesthetics — colors, typography, spacing, and hover effects for a list that fits seamlessly into your site.

  1. Mate List:
    Item padding, border, border radius, and Normal/Hover tabs with background, box shadow, and hover border color.
  2. Image:
    Width, height, padding, border, border radius, and CSS filters for the featured image.
  3. Title:
    Spacing plus the full title styling — color with hover, typography, and text shadow.
  4. Text:
    Color, typography, and spacing for the excerpt.
  5. Category:
    Spacing, space between badges, and the full category badge styling.
  6. Meta:
    Spacing and space-between for the author/date row.
  7. Author:
    Name color (normal and hover), typography, text shadow, avatar size/border/radius/shadow/filters, and date color and typography.
  8. Pagination:
    Full styling for the numbered pagination links.
  9. Play Button:
    Full styling for the video play button.

Save and Preview

  1. Once you’ve customized and styled your list, click “Publish” or “Update” to save your changes.
  2. Preview the page to ensure the widget looks and functions as desired.

Best Practices

  1. Consistency: Maintain a consistent style with the rest of your website for a cohesive look.
  2. Use Featured Images: Give every queried post a featured image so cards stay visually even.
  3. Accessibility: Keep title tags semantic (one H1 per page) and excerpt text legible.
  4. Testing: Check column counts and gaps across devices and screen sizes for a responsive design.

Troubleshooting

  1. No Posts Showing: Verify the Query section returns published posts (check post type, terms, and Posts Per Page).
  2. Pagination Not Working: Pagination relies on the page’s paged query variable — it works on regular pages and archives, but avoid combining multiple paginated widgets on one page.
  3. Play Button Not Appearing: Show Video must be on and the post needs a video link saved in its Sky Addons video link field.

Frequently Asked Questions

How do I show my latest blog posts in a list with Elementor?

Drop the Mate List widget on the page and configure the Query section — by default it lists your most recent posts with image, category, title, excerpt, author, and date in a horizontal card layout.

How do I add pagination to the Mate List widget?

Enable Show Pagination in the Additional section. Numbered page links appear below the list, and the Pagination style section controls their colors, spacing, and active state.

What is the difference between Mate List and Mate Carousel?

Both share the same query builder and post card elements. Mate List renders a static grid with optional numbered pagination; Mate Carousel slides the same cards in a Swiper carousel with autoplay, navigation arrows, and bullets.

How do I limit the excerpt length in the Mate List?

Set Text Limit in the Additional section (default 15 words, taken from the post content). A value of 0 outputs the full text, and Strip ShortCode removes shortcodes from the preview.

Can the Mate List play videos from posts?

Yes. Turn on Show Video, and posts with a video link in their Sky Addons video link field show a play button that opens the video in a lightbox, configurable in Video Settings.

Related Documentation

Conclusion

The Mate List Widget by Sky Addons for Elementor gives your blog a tidy, readable post listing with all the trimmings. Utilize its query builder, layouts, and pagination to keep readers moving through your content. For further assistance, consult the Sky Addons support team or community forums. Enjoy listing your posts!

How can we help?