---
title: "Divi Post Tiles Pro"
url: "https://divipeople.com/docs/post-tiles.md"
canonical: "https://divipeople.com/docs/post-tiles/"
published: "2025-11-20"
modified: "2026-07-09"
author: "Fahim Reza"
tags:
  - "Divi Blog Pro"
---

# Divi Post Tiles Pro

**Divi Post Tiles Pro** turns your latest posts into a magazine-style mosaic. The first post renders as a large featured tile, and the remaining posts fill a compact grid of smaller tiles beside it — a bold, modern hero section for news sites, magazines, and content-heavy blogs.

## Key Features

- **Featured-tile mosaic** — the first post automatically becomes a large spotlight tile.
- **Side Columns control** — 1 to 4 responsive columns for the smaller tiles.
- **Image hover effects** — Zoom In, Zoom Out, or Fade on the tile background.
- **Positionable category badge** — place it in any corner of the tile.
- **Powerful query controls** — post types, categories, custom taxonomies, include/exclude by ID, offset, and ordering.

## Adding the Module

1. Edit a page with the **Divi Visual Builder**.
2. Add a new module and search for **Post Tiles Pro**.
3. The tile mosaic renders with your latest posts — open the module settings to configure the query, elements, and design.

## Content Settings

### Query

The Query toggle controls which posts appear in the tiles. The first post returned by the query becomes the featured tile.

1. **Post Type** – Choose the content type to display: Posts, Pages, or a public custom post type (default: Post).
2. **Included Categories** – Show only posts from the selected categories.
3. **Custom Taxonomy** – Filter by a custom taxonomy instead of categories.
4. **Taxonomy Terms** – The terms (IDs or slugs) to match within the chosen taxonomy.
5. **Order By** – Sort posts by Date, Title, ID, Author, or Random (default: Date).
6. **Sort Order** – Ascending or Descending direction.
7. **Post Limit** – How many posts to show in the mosaic (default: 6).
8. **Date Format** – Customize the displayed post date using standard WordPress date formats.
9. **Post Offset Number** – Skip a number of posts before the tiles start (default: 0).
10. **Include Posts by IDs** – Display only the posts whose IDs you list.
11. **Exclude Posts by IDs** – Hide specific posts even when they match the query.

### Layout Settings

The Layout Settings toggle controls which elements each tile shows.

1. **Show Image** – Toggle the featured image background (default: On).
2. **Image Size** – Thumbnail, Medium, Large, or Full.
3. **Show Title** – Toggle the post title (default: On).
4. **Title Heading Level** – Render titles as H1–H6.
5. **Show Excerpt** – Toggle the post summary (default: On).
6. **Excerpt Length** – Number of characters shown in the excerpt (default: 150).
7. **Show Categories** – Display the category badge on the tile (default: Off).
8. **Show Single Category** – Show only the first category on the badge (default: Off).
9. **Show Author** – Display the author name (default: On).
10. **Show Date** – Display the publish date (default: On).

## Design Settings

The Design tab styles the mosaic and everything inside it with Divi's full typography, color, spacing, border, and shadow controls.

- **Grid Style** – **Side Columns** (1–4, default: 3, responsive) controls how many smaller tiles sit beside the featured tile, and **Gap Size** (default: 5px) sets the spacing between tiles.
- **Thumbnail Style** – Image Fit (default: Cover), Image Height, and Image Hover effect (None, Zoom In, Zoom Out, or Fade).
- **Content Box** – Alignment and spacing of the text overlay on each tile.
- **Post Title** and **Post Excerpt** – Full typography controls, with separate sizing possible for the featured tile's texts.
- **Category** – Badge Position (top left, top right, bottom left, or bottom right), position Offset, and Background Color (default: #FF2851).
- **Author** and **Date** – Typography and color for the meta line.

## Tips & Notes

> **Featured tile order**
> The featured (large) tile is always the *first* post returned by the query. To feature a specific post, put its ID first via **Query → Include Posts by IDs**, or adjust the ordering so it comes first.

> **Post Limit and balance**
> For a balanced mosaic, match the Post Limit to your Side Columns — for example, 3 side columns look best with 6–7 posts (1 featured + 5–6 small tiles).

> **Use sharp images**
> Tiles display the featured image as a full-bleed background. Use at least the Large image size so the featured tile stays crisp on wide screens.

## FAQ

### How do I choose which post is featured?

The first post from your query becomes the featured tile. Use **Include Posts by IDs** with your chosen post first, or change **Order By / Sort Order** so the right post leads.

### Can I change how many small tiles appear per row?

Yes — set **Design → Grid Style → Side Columns** to 1–4. It is responsive, so you can reduce the columns on tablet and phone.

### How do I show the category badge on tiles?

Turn on **Layout Settings → Show Categories** (optionally with Show Single Category), then position and style the badge under **Design → Category**.

### Can I add a hover animation to the tiles?

Yes. Choose Zoom In, Zoom Out, or Fade under **Design → Thumbnail Style → Image Hover**.