How to Create Website Thumbnails for a Portfolio on WordPress in India

To create portfolio thumbnails in WordPress, prepare one representative image for each project, upload it to the Media Library, and set it as the project’s featured image if your theme uses featured images. Then adjust the portfolio template or Gallery block so tiles share the intended shape, and preview the real portfolio page on desktop and mobile. The theme’s frame and crop settings determine the final result; there is no single thumbnail size required for every portfolio or for sites in India.

WordPress documentation describes a default Thumbnail size of 150 × 150 pixels, but this is a configurable default, not a universal portfolio recommendation. Choose an image rendition that looks clear at the size your grid actually displays. WordPress Theme Handbook: Featured Images and Post Thumbnails

1. Identify how your portfolio is built

First determine whether projects are individual portfolio entries or images arranged directly on a page. WordPress.com guidance describes portfolio projects as a dedicated category with block themes, or as a custom post type with some classic themes. The active theme controls whether a project archive, featured-image field, or portfolio template is available. Interface details can differ by theme and WordPress setup; the official documentation reviewed does not specify an India-only workflow.

Approach	Good fit when	What controls the result
Featured image on each project	Each project has its own page or post and should appear in a theme-driven grid	The project template, archive template, and featured-image support
Gallery block on a page	You want to curate a visual grid directly on a page	Gallery columns, image resolution, crop behavior, and link settings

Featured images represent an individual post, page, or custom post type. A theme must support featured images for the corresponding editing interface to appear. WordPress Theme Handbook

2. Prepare a useful project image

Choose a visual that identifies the work quickly: a product screen, a distinctive detail, or a composition that communicates the project.
Crop around the important subject before uploading if the source has irrelevant margins or a focal point that a centered crop would remove.
Use a consistent visual treatment across projects, such as similar framing and background treatment. The tile ratio can be enforced by the template or gallery, but inconsistent source images may crop differently.
Avoid reducing a detailed full-page website screenshot until its text and controls become illegible. A representative screen or detail is often more legible at thumbnail scale.
Use an image large enough for the displayed rendition and any high-density display you target. Do not assume a particular pixel dimension or compression setting is required; inspect the actual grid and theme recommendations.

Upload through Media Library or from the project editor. Use descriptive filenames and meaningful alternative text where the image conveys information; if the project title already describes the link destination, ensure the linked image is not the only accessible label.

3. Add and assign a featured image

Open the portfolio project for editing, or create a new project using the portfolio content type configured by your theme.
In the editor sidebar, find Featured Image, choose or upload the project visual, and confirm the selection.
Save or update the project.
Open the portfolio listing and verify the image appears. If the Featured Image control is missing, check whether the theme supports it and whether the correct project post type is open. In some editor screens, sidebar panels can be hidden.

For a block theme, open the Site Editor and locate the template used by the portfolio archive or project listing. Select its Featured Image block and inspect the available aspect-ratio, width/height, and scale controls. “Cover” fills the set frame by cropping; “Contain” preserves the entire image and can leave empty space. Choose based on the visual content, then preview the template. Other themes may expose portfolio or featured-image settings elsewhere. WordPress.com portfolio guidance

4. Create a grid with the Gallery block

Use a Gallery block when the images themselves are maintained in a page rather than generated from project entries.

Edit the page and insert a Gallery block using the block inserter or by typing /gallery.
Upload images or select them from the Media Library. Arrange them in the intended project order.
Select the Gallery block (rather than an individual image) and set the number of columns. The documented control allows 1–8 columns, constrained by the number of images.
Choose an image resolution from the options supported by the theme and uploaded source, such as Thumbnail, Medium, Large, or Full Size.
Enable crop-to-fit for uniform tiles, then set the common aspect ratio if the control is available. If the crop removes a project’s subject, adjust the source image or use a less aggressive ratio.
Set link behavior deliberately: link to the project page if visitors should see project details; use a media file, attachment page, lightbox, or no link only when that is the intended interaction and available in your editor.
Preview the published page at desktop and mobile widths. Confirm that image order, crop, quality, and click behavior all work.

Gallery controls and available image resolutions depend on theme support and the dimensions of the source images. WordPress Gallery block documentation

5. Understand thumbnail sizes and cropping

WordPress’s standard image size names include Thumbnail, Medium, Medium Large, Large, and Full Size. The Theme Handbook lists defaults of 150 × 150 maximum for Thumbnail, 300 × 300 maximum for Medium, 768 pixels wide with no height limit for Medium Large, and 1024 × 1024 maximum for Large; Full Size refers to the original upload. These are defaults and named renditions, not a requirement that your portfolio tiles use one of them. WordPress Theme Handbook: image sizes

Media settings can change the thumbnail, medium, and large dimensions and the thumbnail crop behavior. Changing those settings does not automatically guarantee that every existing uploaded image has all newly configured renditions; if old images still show an unsuitable crop or size, check the theme and media workflow for regenerating image sizes before making bulk changes. Back up before bulk media operations.

Cover or crop-to-fit: fills a uniform tile and may cut off edges. Use a deliberate focal point and inspect every tile.
Contain or uncropped: shows the full image but may leave blank bands or uneven visual weight.
Full-size source: may preserve detail but can deliver more image data than a small tile needs. Prefer an appropriate generated rendition when available.
Custom theme size: developers can register a named size with add_image_size() and render it in the template. The theme must then use that size consistently.

6. Choosing between featured images and a Gallery block

Question	Featured images	Gallery block
Are projects structured entries?	Yes; each project’s image is attached to its entry and can feed a theme grid.	Not necessarily; images are selected and maintained in the page gallery.
How is the grid maintained?	Theme template or portfolio settings determine layout.	Page editor controls columns, resolution, crop, and order.
How dependent is it on the theme?	High: featured-image support and a suitable project template matter.	Still theme-dependent, but block-level controls are available where supported.
Where should a click go?	Usually the project permalink when the theme links cards to entries.	Choose a project page, media file, attachment page, lightbox, or no link in block controls.

Choose the approach that matches your content structure. Avoid manually duplicating a project grid in a page if the theme already generates it from project entries, unless you need that separate curated layout.

7. Developer option: register a thumbnail size in a classic theme

If you maintain a classic theme, register a named crop and request it in the portfolio template. Add theme code in a child theme or site-specific plugin rather than editing a parent theme that updates may replace.

// In a theme setup function, such as functions.php:
add_action( 'after_setup_theme', function () {
    add_theme_support( 'post-thumbnails' );
    add_image_size( 'portfolio-card', 640, 480, true );
} );

// In the portfolio loop/template:
if ( has_post_thumbnail() ) {
    the_post_thumbnail( 'portfolio-card' );
}

The example requests a 640 × 480 cropped rendition; it is an implementation choice, not a WordPress standard or universal recommendation. The fourth argument enables hard cropping. Review the theme documentation and generated output for your exact setup. WordPress notes that image sizes can be registered and selected in theme templates. Theme Handbook

8. Capture consistent source images from live websites

If each portfolio tile needs a screenshot of a live project website, first capture a representative page at a consistent viewport and then upload that image as the project’s featured image or Gallery image. A browser screenshot tool is useful for creating those source images; WordPress still controls how the uploaded source is cropped and displayed.

Manual browser capture

Open the project page at a consistent viewport size and wait until its main content has loaded.
Capture the visible viewport or full page, depending on what the tile needs to communicate.
Crop to the subject and intended tile ratio in your image editor.
Upload the result to WordPress, set it as the featured image or add it to the Gallery, then preview the portfolio layout.

Or skip the browser setup

Use ScreenshotNeo to capture a project page with one GET request. Replace the target URL with the project you want to show. The API returns an image or PDF; see the ScreenshotNeo API documentation for request options and output configuration. You can then upload the resulting image to WordPress.

cURL

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

Python

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)

Node.js

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}`);
const bytes = new Uint8Array(await res.arrayBuffer());
await (await import('node:fs/promises')).writeFile('shot.webp', bytes);

ScreenshotNeo removes cookie and consent banners, newsletter popups, and chat widgets before capture; each cleanup step can be turned off. Bot checks or CAPTCHAs, blank pages, timeouts, failed loads, and cache hits are not billed, and response headers identify the page verdict and billing status. Its MCP server provides screenshot tools for Claude, Cursor, and other MCP clients. Plans include 1,000 screenshots per month free with no card; paid plans start at $5 for 3,000. ScreenshotNeo also offers full-page capture, element capture, device and viewport options, dark mode, custom CSS and JavaScript, wait conditions, and more; see the docs for supported parameters. Visit ScreenshotNeo for product details, then sign up for 1,000 free screenshots a month with no card.

9. Troubleshooting thumbnails

Symptom	Likely cause	What to do
No Featured Image field	The theme or project post type may not support featured images, or the editor panel is hidden.	Check editor sidebar and screen options, then consult the theme setup. Developers can enable post-thumbnail support for the relevant post type.
Thumbnail is blank or missing	No featured image is assigned, the project template does not output it, or an image URL/load problem exists.	Confirm the assignment, inspect the template and browser network errors, and test the source image URL.
Subject is cut off	Cover mode, hard crop, or Gallery crop-to-fit removes the focal point.	Change the focal crop, use a different source composition, or switch to an uncropped/contain treatment.
Tiles have different heights	Images retain varying aspect ratios, or the template does not enforce a common frame.	Set a consistent aspect ratio and crop behavior in the template or Gallery block, then inspect all source images.
Image appears soft or pixelated	The selected rendition may be too small for the rendered tile or a high-density display.	Select a larger available rendition or upload a suitable source image, then check the actual rendered dimensions.
Image loads slowly	The page may be requesting unnecessarily large full-size sources or many images.	Use an appropriate generated rendition and avoid using full-size files for small cards where a smaller version is suitable.
New crop or dimensions do not appear	An old generated rendition, cached page, or theme-specific image size may still be in use.	Check the rendered image URL and cache, then follow your site’s safe image-size regeneration process if required.
Gallery image opens the wrong destination	Gallery link behavior points to a media or attachment page rather than the project.	Change link settings or use individual links that lead to the project detail page.

10. Performance, reliability, and cost

Performance: portfolio pages with many large source images can transfer more data than necessary. Select an image rendition appropriate to its display size and keep image dimensions sufficient for the actual layout.
Consistency: one template-level ratio and scale rule is easier to repeat across project entries than individually improvised crops. Still inspect each image because a uniform crop can hide different subjects.
Reliability: keep a copy of original project visuals. Theme changes can alter card proportions or templates, so recheck the grid after changing themes or portfolio templates.
India: the workflow is the documented WordPress editor workflow; no India-specific thumbnail dimensions or hosting requirements are established by the sources cited here.
Cost: featured-image and Gallery controls are built into WordPress. ScreenshotNeo is optional for generating website screenshots: the free plan includes 1,000 shots monthly without a card, and paid plans start at $5 for 3,000. Yearly billing gives two months free; all features are on every plan.

11. Launch checklist

Every project has the intended image assigned or included in the correct gallery.
The theme or Gallery block uses the intended ratio, resolution, crop, and scale behavior.
The important subject remains visible in every tile.
Project cards link to the intended project destination.
The portfolio is readable on desktop and mobile, and image quality is acceptable at both sizes.
Old renditions or caches are not masking the updated image.

FAQ

Is 150 × 150 pixels the right size for a portfolio thumbnail?

It is WordPress’s documented default Thumbnail size, not a universal target. Let the rendered tile size and theme determine the rendition you choose.

Can I use a full-page website screenshot as a portfolio thumbnail?

Yes, but at small grid sizes its details may be too tiny to read. Consider using a representative screen or a focused crop for the card and show the full page on the project detail page.

Do I need a special process because my WordPress site is in India?

The cited WordPress documentation describes the same editor and theme workflow without an India-specific thumbnail process. Follow your active theme’s controls and preview the published result.

Should a portfolio thumbnail link to the image file or the project?

For a project portfolio, linking the card to the project detail page is usually the clearest path. Test the actual link behavior in your theme or Gallery settings.