Skip to content

Fix: constrain image sizes in email notifications - #3637

Open
faisalahammad wants to merge 1 commit into
Automattic:trunkfrom
faisalahammad:fix/3529-avatar-email-max-width
Open

Fix: constrain image sizes in email notifications#3637
faisalahammad wants to merge 1 commit into
Automattic:trunkfrom
faisalahammad:fix/3529-avatar-email-max-width

Conversation

@faisalahammad

@faisalahammad faisalahammad commented Aug 10, 2026

Copy link
Copy Markdown

Fixes #3529

Proposed changes:

  • Email notifications currently size avatars and post images with CSS only. That CSS is injected mid-body by the embed, and desktop email clients frequently strip or ignore it, so a remote user with a large avatar renders the image at native size and pushes the message off screen.
  • Added a global img { max-width: 100%; height: auto; } rule to the shared email header style block so every image in every email template fits the email width.
  • Added explicit width/height attributes to the embed avatar (48px) and the new follower icon (64px) so the size holds even when styles are dropped. These match the sizes the existing CSS already enforces, so the public embed output is unchanged.

Other information:

  • Have you written new tests for your changes, if applicable?

Logged-in test of email templates can't be automated here, so the fix was verified against the repository CSS and template output. The changes are template and CSS-only with no logic change, so no PHPUnit coverage is added.

Testing instructions:

  • Set up a local environment and install the plugin (npm run env-start).
  • Receive a direct message or mention from a remote account whose avatar is larger than 48px, and open the resulting email in a client that strips <style> blocks (for example Gmail).
  • Confirm the avatar now renders at 48px instead of its native size and the message content stays within the email width.
  • Trigger a new follower email from an account with a large icon and confirm the icon is 64px.
  • Check a public post with attachments still shows the 48px avatar and full-width preview grid in the embed (regression check).

Changelog entry

  • Automatically create a changelog entry from the details below.

A changelog entry was added manually as .github/changelog/fix/3529-avatar-email-max-width.

Changelog Entry Details

Significance

  • Patch
  • Minor
  • Major

Type

  • Added - for new features
  • Changed - for changes in existing functionality
  • Deprecated - for soon-to-be removed features
  • Removed - for now removed features
  • Fixed - for any bug fixes
  • Security - in case of vulnerabilities

Message

Fixed oversized avatar and post images in email notifications from remote users. Avatars and inline images now resize to fit the email width instead of overflowing the screen.

Constrain avatar and post images in email notifications so large
remote avatars no longer render at native size and overflow the
screen. Email clients often strip inline styles, so the size is now
enforced with width/height attributes on the embed avatar, the new
follower icon, and a global max-width rule in the shared email header
style block.

Fixes Automattic#3529
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Projects

None yet

Development

Successfully merging this pull request may close these issues.

Overly large avatar images in email notifications

1 participant