ScreenshotNeo

BlogHow-to

How to Generate Website Thumbnails for a WordPress Blogroll

Generate and display website screenshot thumbnails for WordPress blogroll links with plugins, destination images, or a screenshot API.

By the ScreenshotNeo team4 October 20269 min read

To generate website thumbnails for a WordPress blogroll, capture each destination URL with a screenshot service or a links-gallery plugin, then display the resulting preview beside the link. If a destination publishes an Open Graph image, a link-card plugin can use that image instead. WordPress featured images and Site Icons serve different purposes: neither automatically captures a remote page.

The right method depends on whether you need a real rendering of the destination, whether previews should refresh automatically, and where the image will be hosted. This guide covers plugin-based setup, a direct screenshot API workflow, alternatives, maintenance, and common issues.

1. Choose what kind of thumbnail you need

Method What appears Best fit Main dependency
Screenshot service/plugin A rendered image of the destination page You want the page’s actual visual appearance Screenshot service, credentials, compatible plugin or custom integration
Links-gallery plugin A link entry with an automatically generated screenshot You want a managed gallery and refresh controls Plugin maintenance, configuration, and its capture workflow
Open Graph link card An image selected by the destination site You want a quick preview when metadata is available Destination metadata and remote image availability
WordPress featured image An image attached or selected in WordPress You can choose or upload a representative image yourself Manual image selection and theme thumbnail support
Site Icon A compact identity mark, like a favicon You want to identify a site, not preview its page The destination’s icon or an icon you provide

For an actual website screenshot thumbnail, use a screenshot route. A Site Icon is intended for site identity; WordPress’s post-thumbnail functions output an image attached to WordPress content. They do not capture an external URL. WordPress recommends a square Site Icon at least 512 by 512 pixels. WordPress Developer Resources documents featured-image support and thumbnail output; see also the WordPress Site Icon documentation.

2. Use a WordPress plugin to display URL screenshots

A plugin is usually the shortest path if its capture options, output, and maintenance status suit your site. The Urlbox WordPress Screenshots plugin documents generating screenshots through the Urlbox API and displaying them with a shortcode. Its README shows a shortcode such as [urlbox url=urlbox.com thumb_width=600] and documents a full_page=true option. It requires WordPress, a Urlbox account, and API credentials. Check current plugin compatibility and service terms before installing. The plugin README has the documented setup details.

  1. Review the plugin’s current compatibility, maintenance, and account requirements.
  2. Install and activate it from the source you have vetted.
  3. Create the required service account and configure its API credentials in the plugin as documented by its maintainer. Treat credentials as secrets; do not put them in public page content.
  4. Add the documented shortcode to the blogroll entry or template, supplying the destination URL and a thumbnail width appropriate to your layout.
  5. Preview the page on desktop and mobile. Confirm the image dimensions, crop, link target, and loading behavior.
  6. Decide how and when screenshots should refresh. A destination redesign can make a stored preview stale.

The example shortcode is plugin-specific, not native WordPress syntax. Verify the plugin’s current parameter names and output behavior against its own documentation. A third-party plugin may change or become incompatible as WordPress changes.

If you want the blogroll to behave as a gallery, WP Links Page describes a grid or list of links with title, description, screenshots, shortcode output, and scheduled or on-demand screenshot updates. Review its current maintenance and compatibility before choosing it. Its listing describes the available workflow, but it is not an independent performance evaluation. See the WP Links Page listing.

This route can reduce custom template work, but check how the plugin stores and serves screenshots, whether refreshes are automatic or manual, and what settings control image size and layout. Test a small set of links first, especially if your blogroll contains many destinations.

4. Use a destination’s Open Graph image

A link-card plugin can read a destination page’s metadata and display its Open Graph image when one is available. Simple Link Embed describes fetching metadata for a selected URL and using the page’s Open Graph image and favicon; preview media may load from the linked destination when the card is displayed. See the Simple Link Embed listing.

This is not a screenshot. The destination controls the image, and it may be missing, outdated, or unavailable. Remote loading also means your page’s preview depends on the destination’s availability and its image URL remaining usable. Choose this method when a publisher-provided card image is acceptable, rather than when you need a faithful capture of the rendered page.

5. Add hand-picked images with native WordPress thumbnails

If you want editorial control, upload or select an image in WordPress for each blogroll entry and output it using your theme’s supported image size. WordPress documents enabling post-thumbnail support and registering sizes; the_post_thumbnail() outputs the selected image, with post-thumbnail as the default when the theme registers that support. Read the WordPress featured images documentation.

This method works for images you have attached to WordPress content. It does not fetch or screenshot a remote website. Check that the theme supports featured images and that the chosen size fits your card layout.

6. Generate screenshots directly with an API

A screenshot API is useful when you need to create previews outside a plugin, control the capture workflow, or build your own WordPress integration. A typical flow is: collect the destination URL, request a capture, save or serve the returned image, and render it beside the link. Protect API credentials on the server; do not expose secret keys in browser-side JavaScript or public shortcodes.

cURL example

curl -G "https://api.screenshotneo.com/v1/shot" \
  -d access_key=YOUR_API_KEY \
  --data-urlencode url=https://example.com \
  -o blogroll-thumbnail.webp

Python example

import requests

response = requests.get(
    "https://api.screenshotneo.com/v1/shot",
    params={"access_key": "YOUR_API_KEY", "url": "https://example.com"},
    timeout=90,
)
response.raise_for_status()
with open("blogroll-thumbnail.webp", "wb") as image_file:
    image_file.write(response.content)

Node.js example

const q = new URLSearchParams({
  access_key: 'YOUR_API_KEY',
  url: 'https://example.com'
});
const res = await fetch(`https://api.screenshotneo.com/v1/shot?${q}`);
if (!res.ok) throw new Error(`Screenshot request failed: ${res.status}`);
const image = Buffer.from(await res.arrayBuffer());
await import('node:fs/promises').then(fs => fs.writeFile('blogroll-thumbnail.webp', image));

These examples save a capture to a file. For a WordPress integration, run the request in trusted server-side code, validate that the requested URL is permitted, and store or serve the image using your chosen media workflow. Do not accept arbitrary URLs from unauthenticated visitors: unrestricted URL fetching can expose your server to requests you did not intend. See the ScreenshotNeo API documentation for API options and response details.

7. Size, refresh, and serve the thumbnails carefully

  • Choose dimensions for the design. Set a consistent thumbnail width and aspect ratio so the grid does not jump as images load. If you crop screenshots, keep enough of the page visible to identify it.
  • Decide between page capture and a selected element. A full-page image shows more content but can be very tall and hard to read at card size. A viewport or selected element can make a more legible thumbnail.
  • Set a refresh policy. Refresh after a destination redesign or on a schedule appropriate to how often the blogroll changes. Avoid recapturing every image on every page view.
  • Plan for failures. Keep a fallback image or text-only link for destinations that block capture, time out, or disappear.
  • Keep credentials private. Store keys in server-side configuration or a secrets manager. Restrict who can edit settings that trigger captures.
  • Check image hosting and caching. A locally stored image can reduce reliance on the destination at display time; a remotely loaded image depends on that host. Confirm your selected plugin or integration’s actual behavior.

8. Or skip the browser setup

ScreenshotNeo is a website screenshot API and MCP server for developers. One GET request can return a PNG, JPEG, WebP, or PDF; the API also accepts the parameter names used by other screenshot APIs to make switching easier.

curl -G "https://api.screenshotneo.com/v1/shot" \
  -d access_key=YOUR_API_KEY \
  --data-urlencode url=https://example.com \
  -o blogroll-thumbnail.webp

See the ScreenshotNeo API documentation for request options. Cookie and consent banners are accepted like a visitor and more than 60 known consent platforms, newsletter popups, and chat widgets are removed before the shot; each step can be turned off. Bot checks, blank pages, timeouts, failed loads, and cache hits cost nothing, and response headers identify the page verdict and billing status. The MCP server gives AI agents tools to take screenshots, get page information, and capture PDFs. The Free plan includes 1,000 shots per month with no card; paid plans start at $5 for 3,000 shots.

Sign up for ScreenshotNeo’s free plan: 1,000 screenshots a month, no card required.

9. Troubleshooting

Symptom Likely cause What to check or do
No thumbnail appears The shortcode is not recognized, the plugin is inactive, or its credentials are missing or invalid. Confirm plugin activation, shortcode syntax, account setup, and the plugin’s current credential instructions.
The image is an icon, not a page preview The chosen method uses a Site Icon or favicon. Use a screenshot capture method when the requirement is a rendered page image.
The preview looks different from the current site The screenshot is cached or has not been refreshed. Use the plugin or service’s documented refresh control, and establish a refresh schedule.
The card has no image The destination has no usable Open Graph image, or the remote image cannot load. Use a screenshot or a hand-picked WordPress image as a fallback.
The screenshot shows a consent banner or popup The capture workflow did not dismiss or remove that element. Check whether your screenshot service supports consent handling, popup removal, or custom page actions; confirm the relevant options are enabled.
The destination capture is blank or incomplete The page may load slowly, rely on client-side rendering, or block automated access. Check the capture service’s wait options and page status. Keep a fallback link or manually selected image for inaccessible destinations.
Images vary in size or the layout shifts Source captures have different dimensions or no fixed display ratio is set. Use consistent image dimensions or a CSS container with a defined aspect ratio and suitable object-fit behavior.
API request fails Incorrect URL encoding, invalid credentials, network timeout, or an HTTP error. Encode the destination URL, check credentials and the HTTP status, use an appropriate timeout, and consult the API response documentation.

10. Performance, reliability, and cost

Capturing screenshots during every blogroll page request can make that page depend on multiple remote captures. Prefer generating or refreshing previews ahead of display, then serving saved or cached images. For a large link list, consider processing captures in batches and limiting concurrent requests according to the service and plugin’s documented limits.

Reliability depends on both the destination and the capture route. A destination can change its layout, block automated access, or become unavailable. Open Graph cards can fail when remote metadata or image hosting changes. A WordPress-hosted fallback image preserves a usable entry when a capture is missing, while periodic refreshes keep screenshots from becoming stale.

Cost depends on the chosen plugin or service terms, capture volume, and refresh frequency. Verify current service pricing and plugin requirements before committing. ScreenshotNeo’s stated plans are Free for 1,000 shots per month, Starter $5 for 3,000, Growth $15 for 15,000, Pro $39 for 60,000, Scale $99 for 250,000, and Business $249 for 1,000,000; yearly billing gives two months free, and every feature is on every plan. No independent performance comparison is implied by these plan details.

Frequently asked questions

Can WordPress create a screenshot of any external URL by itself?

WordPress’s featured-image functions output images attached to WordPress content. Use a screenshot service, a plugin that integrates one, or your own server-side capture workflow for remote page screenshots.

Is a favicon good enough for a blogroll thumbnail?

Use a favicon when you want a compact site identity mark. Use a page screenshot or preview image when readers need to recognize the destination’s appearance.

Will every external site provide an Open Graph preview image?

No. Metadata and remote image availability are controlled by each destination. Have a fallback if every blogroll entry needs a visual.

Should I use a full-page capture for a small card?

Usually decide based on legibility: a long page shrunk into a small card can be difficult to recognize. A viewport-sized capture may work better for a compact preview.