nuxt-x-marketing
BlogList
Paginated, filterable grid of XMarkBlogCard components with search and category filter.
BlogList
A paginated grid of post cards with optional search input and category dropdown filter. Internally renders XMarkBlogCard for each post.
Components
<XMarkBlogList />
A paginated grid of post cards with optional search input and category dropdown filter.
<XMarkBlogList
:posts="allPosts"
:columns="3"
:per-page="9"
:has-filters="true"
:has-categories="true"
:has-authors="true"
:categories="['Tutorials', 'News', 'Case Studies']"
:card-button="{ label: 'Read More' }"
/>
Props
| Prop | Type | Default | Description |
|---|---|---|---|
posts | Array | [] | Array of post objects |
columns | Number | 3 | Grid columns: 1, 2, 3 |
perPage | Number | 9 | Posts per page |
hasFilters | Boolean | false | Show search and category filter bar |
hasCategories | Boolean | true | Show category badges on cards |
hasAuthors | Boolean | true | Show author info on cards |
categories | Array | [] | Available categories for filter dropdown |
cardButton | Object | null | Button config passed to every card |
AI Context
category: Blog
package: "@xenterprises/nuxt-x-marketing"
components:
- XMarkBlogList
use-when: >
Building the main /blog index page or a category listing page. Provides
search, category filtering, and pagination out of the box.
typical-page-section: /blog index page main content area.