How to Create Website Thumbnails for a Notion Link Directory
Make website entries visual in a Notion link directory with Gallery card previews, and learn when you need to create and add thumbnails yourself.
To show thumbnails for websites in a Notion link directory, put each link in a database page, display the database as a Gallery, then set Layout → Card preview to Page cover, Page content, or an image property. Add an image to that source on each entry. A URL property is useful for storing the website address, but Notion’s documented gallery workflow does not say that it automatically fetches a thumbnail from that URL. Notion’s Gallery view guide documents the preview sources and image-fit setting.
1. Organize links as database entries
Create a database for the directory, or use an existing database. Make each saved website its own page. Keep the page title descriptive and add a URL property for the destination. You can add other properties such as topic, tags, or notes to make the directory easier to maintain.
A Gallery is a database view, so its cards represent database pages. You can create a Gallery as a new view or add one to an existing database. Notion’s gallery documentation describes both approaches.
2. Choose a card preview source
Open the database view settings, choose Layout, then find Card preview. Select the source that matches how you want to manage images:
| Preview source | Use it when | What to set up |
|---|---|---|
| Page cover | You want to choose a deliberate image for each link page. | Set or upload a cover on each database page, then select Page cover for the Gallery. |
| Page content | The page already begins with the image or video you want on its card. | Put that media first in the page content, then select Page content. |
| Files & media property | You want a dedicated image field alongside the URL and other directory data. | Add or use a Files & media property, add an image to each entry, and select that property as the preview. |
These are the documented card-preview choices. Notion’s guide also notes that you can use Unsplash to find custom page covers from within Notion. Notion’s gallery guide explains the cover workflow.
3. Add an image to each website entry
- Pick one preview source for the directory, such as Page cover.
- Open an entry and add or upload an image to the matching source.
- Repeat for the other entries, keeping image subject and framing reasonably consistent.
- Return to the Gallery and confirm the selected source is showing on the cards.
If you chose Page content, make sure the desired image or video is the first block in each page. If you chose a Files & media property, confirm that property contains an image for each entry. A URL alone is not one of the documented card-preview image sources.
4. Choose whether cards fit or crop images
Use the Gallery’s Fit image setting to control how images occupy the card frame. When Fit image is on, the whole image fits inside the frame and can be repositioned. When it is off, the image is cropped to fill the frame. Notion’s Gallery view help describes these behaviors.
- Turn Fit image on when the full artwork matters, such as a diagram or cover with important details near its edges.
- Leave it off when you prefer cards filled edge to edge and are comfortable with cropping.
- Use images with a consistent visual style so the directory is easy to scan; this is a practical design choice, not a measured performance claim.
5. Understand what a website thumbnail means in Notion
“Website thumbnail” can mean either an image you add to a Notion Gallery card or a preview automatically extracted from the website URL. The documented Notion Gallery process describes the first: a page cover, the first page-content media block, or an image in a Files & media property. It does not establish that entering a URL automatically supplies the Gallery card image.
If a link preview appears somewhere else in Notion, do not assume it is the source used by the Gallery’s Card preview setting. For a predictable directory, choose one of the documented image sources and populate it for each entry.
6. Troubleshoot missing or unexpected previews
| What you see | Likely cause | What to check |
|---|---|---|
| No image on the card | The selected preview source has no image for that database page. | Add a cover, put media first in page content, or populate the selected Files & media property. |
| The website URL is present, but no thumbnail appears | The URL is a separate directory field; the documented workflow does not say it auto-fills Card preview. | Add an image to the configured preview source. |
| The wrong image appears | The Gallery is reading a different source than the one you edited. | Review Layout → Card preview, then update that source on the page. |
| Only part of the image is visible | Fit image is off, so the image is cropped to fill the frame. | Turn Fit image on and reposition the image if needed, or use an image that tolerates cropping. |
| The image is not the first page-content block | Page content previews the page’s first media block. | Move the intended image or video to the beginning, or choose Page cover or a Files & media property instead. |
Or skip the browser setup
If you need to create website screenshots for the images you add to Notion, ScreenshotNeo returns an image or PDF from one GET request. This example captures a page as WebP; see the ScreenshotNeo API documentation for request options.
curl -G "https://api.screenshotneo.com/v1/shot" -d access_key=YOUR_API_KEY --data-urlencode url=https://stripe.com -o shot.webp
import requests
r = requests.get(
"https://api.screenshotneo.com/v1/shot",
params={"access_key": "YOUR_API_KEY", "url": "https://stripe.com"},
timeout=90,
)
r.raise_for_status()
open("shot.webp", "wb").write(r.content)
const q = new URLSearchParams({ access_key: 'YOUR_API_KEY', url: 'https://stripe.com' });
const res = await fetch(`https://api.screenshotneo.com/v1/shot?${q}`);
if (!res.ok) throw new Error(`Screenshot request failed: ${res.status}`);
await Bun.write('shot.webp', new Uint8Array(await res.arrayBuffer()));
Replace the example URL and API key with the page you want and your key. ScreenshotNeo removes cookie and consent banners, newsletter popups, and chat widgets before capture; those cleanup steps can be turned off. Bot checks, blank pages, timeouts, failed loads, and cache hits cost nothing, and response headers identify the page verdict and whether the request was billed. Its MCP server gives AI agents tools for screenshots, page information, and PDF capture. The free plan includes 1,000 screenshots a month with no card; paid plans start at $5 for 3,000. Sign up for 1,000 free screenshots a month with no card.
FAQ
Can a Notion Gallery use a website URL as its card image?
The cited Gallery documentation lists page cover, page content, and a Files & media property as preview sources. It does not document automatic image extraction from a URL.
Which preview source is easiest to keep organized?
Choose based on where you want the image maintained: covers for page-level artwork, page content when the image belongs at the top of the page, or a Files & media property for a dedicated database field.
How do I keep the full image visible?
Enable Fit image in the Gallery layout settings. With it off, the image is cropped to fill the card frame.


