PDF List & PDF Item
PDF List and its child PDF Item are part of Divi PDF Embed. Together they build a document library — brochures, spec sheets, reports, price lists — where each document gets a name, an optional cover image or icon, file details and a download button, arranged in a grid, list or gallery.
To display a single document inline instead, use the PDF Viewer module.
Key Features
- Three layouts — Grid, List or Gallery, with configurable columns and gap.
- Per-document visuals — a cover image, your own icon image, or the built-in PDF icon in any color.
- File details — a PDF type badge and, for Media Library uploads, the file size.
- Download button on every item, plus an optional View button that opens the PDF in a new tab. Both are fully styleable Divi buttons.
- No JavaScript — these modules render as plain markup and CSS.
Adding the Module
- Edit a page with the Divi 5 Visual Builder.
- Add a module and search for PDF List, or open the PDF Embed folder in the inserter.
- Add one PDF Item child per document, and set its PDF File.
- Optionally give each item a Display Name and a Cover Image.
- Choose the Layout, Columns and Gap on the parent PDF List.
💡 Pick the PDF, not its cover image.
WordPress generates a JPEG preview beside every uploaded PDF. Choose the
PDF List Settings
Content → Layout
| Setting | Description | Default |
|---|---|---|
| Layout | Grid, List or Gallery. | Grid |
| Columns | 1 to 6. Applies to the Grid and Gallery layouts. | 3 |
| Gap | Spacing between items, 0–80px. | 20px |
- Grid — compact cards in columns. The everyday choice for a downloads page.
- List — one document per row, ideal for long libraries where names matter more than thumbnails.
- Gallery — large cover images on top, best when each PDF has an attractive first page.
The Design tab of PDF List holds the standard Divi 5 controls for the container itself — background, sizing, spacing, border, box shadow, filters, transform, animation, position, z-index, scroll effects and sticky. Card styling lives on the PDF Item children. The Advanced tab adds a Custom CSS target for the Items Container.
PDF Item Settings
Content → PDF File
| Setting | Description | Default |
|---|---|---|
| PDF File | Upload from the Media Library or enter a URL. Supports dynamic content (URL). | — |
| Display Name | The document name shown on the card. Supports dynamic content (text). | The file name |
Content → Cover & Icon
| Setting | Description | Default |
|---|---|---|
| Cover Image | Large preview image above the details. Best suited to the Gallery layout. | — |
| Custom Icon | A small icon image used instead of the built-in PDF icon. Ignored when a cover image is set. | — |
| Show File Icon | Show the built-in PDF icon when neither a cover nor a custom icon is set. | On |
| Icon Color | Color of the built-in PDF icon. | Theme default |
The three visuals follow a clear order of precedence: Cover Image → Custom Icon → built-in PDF icon. Set only the one you want.
Content → File Info
| Setting | Description | Default |
|---|---|---|
| Show File Type Badge | A PDF badge beneath the document name. | On |
| Show File Size | The file size, resolved only for PDFs in this site's Media Library. External URLs show nothing. | Off |
Content → Buttons
| Setting | Description | Default |
|---|---|---|
| Download Button | Always shown. Set its label in the Download Button group; supports dynamic content. | "Download" |
| Show View Button | Adds a second button beside Download that opens the PDF in a new tab. | Off |
| View Button text | Label for the View button, in the View Button group. | "View" |
Design
- File Name — full typography controls for the document name.
- File Info Text — typography for the badge and file size line.
- Download Button and View Button — each styled independently with font, background, border, spacing and box shadow.
- The card itself — background, spacing, border, box shadow, filters, transform, animation and transition.
The Advanced tab exposes Custom CSS targets for the File Icon, File Name, File Info, Download Button and View Button.
Style one item, then duplicate it. Every PDF Item carries its own design, so set up the first card exactly how you want it and duplicate it for the rest — you only need to swap the file and name.
FAQ
Does it work with Divi 5?
Yes — PDF List and PDF Item are Divi 5-only modules, native to Divi PDF Embed. Divi 4 is not supported.
Should I use PDF List or the PDF Viewer module?
Use the PDF Viewer to display one document inline on a page. Use PDF List when you're presenting a collection of documents for download.
Can the documents be read on the page?
PDF List is built for downloading rather than reading. Turn on the View Button to let visitors open a document in a new tab, or place a PDF Viewer module alongside the list for a featured document.
Why is the file size missing?
File sizes are read from the local uploads folder, so they only appear for PDFs uploaded to this site. Files hosted elsewhere show the badge without a size.
Can I pull documents from custom fields?
Yes. PDF File accepts dynamic content as a URL, and Display Name and both button labels accept dynamic text — so items work inside Theme Builder templates.
Where can I see it in action?
Visit the Divi PDF Embed product page for a live overview and pricing, or contact support with any questions.