media_image_style_formatter

Extends Drupal core's "Rendered entity" formatter for media reference fields to allow overriding the image style (or displaying the original image) directly in the field formatter settings—natively and seamlessly, without creating extra view modes on the media entity.

Features

• Basic functionality: This module natively integrates with Drupal core by extending the default "Rendered entity" formatter (via hook_field_formatter_info_alter). When you select "Rendered entity" for a media field referencing Image media bundles, new override options appear automatically in the formatter settings.
• Native and seamless integration:
  • No new formatters to choose— it enhances the existing core "Rendered entity" formatter.
  • Works identically in entity "Manage display" pages and in Views field configurations.
  • Automatically detects and lists all available image fields (base fields like thumbnail and bundle-specific ones) for the allowed media bundles.
• Unique features:
  • Override any image field inside the media entity (defaults to field_media_image, but supports custom fields).
  • Apply a specific image style or choose "None (original image)" to display the full-size, uncropped original.
  • Preserves the full rendered media context (captions, alt/title text, links, other fields) while only overriding the image style.
  • Proper cache handling with added cache keys for reliable variation caching.
  • Lightweight—no extra dependencies beyond core Media module.
• Use cases and why use this module: Drupal core requires creating a separate view mode on the Image media bundle for every different image size needed, leading to configuration bloat (as discussed in core issues like #2955679 and #3007749). This module eliminates that overhead:
  • Display the same reusable Image media with a small thumbnail in teasers/lists and a larger version on full pages—using the same media view mode.
  • Show original uncropped images in galleries/lightboxes while using styled/cropped versions elsewhere.
  • Apply context-specific styles in different Views, blocks, paragraphs, or node displays without duplicating media or proliferating view modes.
  • Perfect for media-heavy sites needing flexibility while keeping administration simple and intuitive.

Post-Installation

After enabling the module, no global configuration pages or new content types are added. It integrates natively by enhancing the core "Rendered entity" formatter automatically.

1. Go to Manage display for any entity (node type, paragraph, block type, etc.) with a media reference field limited to Image bundles.
2. Select Rendered entity as the formatter (now powered by this module—no change needed if already selected).
3. In the gear settings, enable Override entity image style.
4. Select the target image field (usually field_media_image) and choose the image style (or "None (original image)").
5. Save. The override applies only to this specific display context.

The override options also appear natively when configuring media fields in Views.

Notes: Works only with Image media types. Clear caches after install if options don't appear immediately. No impact on non-image media (videos, documents, etc.).

Additional Requirements

• Drupal core ^10 || ^11.
• Core Media module enabled.
• Image media bundles with an image field (core default is field_media_image).
• Image styles configured at /admin/config/media/image-styles (optional for "original image" option).

No additional modules or libraries required.

Recommended modules/libraries

• Focal Point or Image Widget Crop – for advanced cropping that works across different styles.
• Core Responsive Image module – for responsive variants (this module works with standard image styles; combine with other tools for full responsive support).
• Media Responsive Thumbnail – alternative for direct responsive image formatting on media fields.
• Blazy or lazy-loading modules – for performance on image-heavy pages.
• Entity Browser – improves media selection experience.

Similar projects

• Media Responsive Thumbnail[](https://www.drupal.org/project/media_responsive_thumbnail) – adds a new "Responsive thumbnail" formatter for direct responsive image styles on media fields (great for responsive needs but adds a separate formatter instead of enhancing the core one).
• RIFT (Responsive Image Formatter Tools)[](https://www.drupal.org/project/rift) – advanced modern responsive techniques (srcset/picture) with custom "Responsive Image View Modes"; more complex but powerful for cutting-edge responsive strategies.
• Field Formatter[](https://www.drupal.org/project/field_formatter) – generic module to render a specific field from the referenced entity (e.g., the image directly); loses full media rendering context (captions, other fields).
• Media Image Display Entity View – separates view mode and style management but still relies on multiple view modes.
• Core default approach (multiple media view modes) – built-in but causes configuration proliferation, as highlighted in core issues (#2955679, #3007749).

This module differentiates by natively extending the standard "Rendered entity" formatter—keeping the full media context intact while providing simple, targeted per-context image style overrides without extra view modes or dependencies.

Supporting this Module

- Check out our sponsor, Dom Host Seo, who made this module possible with their support!

Community Documentation

The module is intentionally simple with self-explanatory settings. Full usage is covered here and in the included README.txt. No videos or demos available yet—contributions welcome!