Problem/Motivation

HTML emails on Varbase sites take the logo from the default theme, which is logo.svg. About 24% of email clients tested by caniemail cannot show SVG images, including Outlook for Windows 2007 to 2016, Outlook for macOS and iOS, and Gmail webmail. Those readers see no logo.

The theme also ships logo.png, but it is 143×32 and does not match the current logo.svg (150×30).

Steps to reproduce

  1. Install Varbase 11.0.x-dev with Varbase Starter 1.0.x-dev.
  2. Send any HTML email (for example a password reset) and open it in Outlook for Windows or Gmail webmail.
  3. The header has no logo.

Proposed resolution

Add logo-email.png: logo.svg as a 150×30 PNG, the same displayed size as the SVG. The Easy Email Theme template sets no width on the logo, so a 2x image would show at double size and dominate the header. The README says what the file is for.

Varbase Starter then points the email logo at it (see Related issues), so this should be released first.

Remaining tasks

  • ✅ File an issue
  • ❌ Addition/Change/Update/Fix
  • ❌ Testing to ensure no regression
  • ➖ Automated unit/functional testing coverage
  • ❌ Developer Documentation support
  • ➖ User Guide Documentation support
  • ❌ UX/UI designer responsibilities
  • ➖ Accessibility and Readability
  • ❌ Reviewed by a human
  • ❌ Code review by maintainers
  • ❌ Full testing and approval
  • ❌ Credit contributors
  • ❌ Review with the product owner
  • ✅ Update Release Notes
  • ✅ Release

User interface changes

  • N/A

API changes

  • N/A

Data model changes

  • N/A

Release notes snippet

  • Added logo-email.png, a PNG logo for HTML emails.

AI-Generated: Yes

CommentFileSizeAuthor
#5 varbase-email-improvements-2026-11.pdf633.51 KBrajab natshah
#5 email-mr-01-png-logo.mp43.58 MBrajab natshah
#5 01-logo-compare-img-src.png51.9 KBrajab natshah
#5 01-logo-after-html-check.png94.35 KBrajab natshah
#5 01-logo-after-email.png36.52 KBrajab natshah
#5 01-logo-before-html-check.png158 KBrajab natshah
#5 01-logo-before-email.png36.37 KBrajab natshah

Issue fork vartheme_bs5-3637288

Command icon Show commands

Start within a Git clone of the project using the version control instructions.

Or, if you do not have SSH keys set up on git.drupalcode.org:

About issue forks

Comments

rajab natshah created an issue. See original summary.

rajab natshah’s picture

rajab natshah
he/him
commented
Related issues: +#3637289: Use a PNG logo in HTML emails instead of the SVG site logo

rajab natshah opened merge request !257

rajab natshah’s picture

rajab natshah
he/him
commented
Status: Active » Needs review

MR !257 is ready for review. Varbase Starter points at the new file in #3637289, so this one goes first.

rajab natshah’s picture

rajab natshah
he/him
commented
StatusFileSize
new 01-logo-before-email.png36.37 KB
new 01-logo-before-html-check.png158 KB
new 01-logo-after-email.png36.52 KB
new 01-logo-after-html-check.png94.35 KB
new 01-logo-compare-img-src.png51.9 KB
new email-mr-01-png-logo.mp43.58 MB
new varbase-email-improvements-2026-11.pdf633.51 KB

Before and after evidence for !257, tested on Varbase 11.0.x with Varbase Starter (Drupal 11.4.12, local DDEV + Mailpit).

Before: the password reset email on Varbase 11.0.x with Varbase Starter 1.0.x-dev. The header logo is the theme's logo.svg.

Password reset email with the Varbase wordmark at the top, a greeting, a blue Log in and reset your password button and closing text.

Before: Mailpit's HTML Check lists 20 warnings, including SVG image format. A linked SVG image is not supported in about 24% of tested email clients (Apple Mail, Outlook for Windows, several Gmail versions) and partly supported in about 12% more.

Mailpit HTML Check with 20 warnings. The SVG image format row is expanded, showing 64% supported, 12% partial and 24% not supported, followed by the list of affected email clients.

After: the same email with the new logo-email.png (150 x 30 PNG). It renders the same, and more email clients can show it.

Password reset email with the Varbase wordmark at the top, now a PNG image, above the greeting and the reset button.

After: HTML Check lists 19 warnings. The SVG image format warning is gone; the remaining rows are the same as before.

Mailpit HTML Check with 19 warnings, from margin to max-height property, with no SVG image format row.

The logo img src in the sent HTML: themes/contrib/vartheme_bs5/logo.svg before, themes/contrib/vartheme_bs5/logo-email.png after (set by Varbase Starter's easy_email_theme.settings.yml). Cropped from Mailpit's HTML Source tab.

Two lines of email HTML source, labelled Before and After. Before, the logo image points to logo.svg; after, it points to logo-email.png.

Release order: vartheme_bs5 !257 first (it adds logo-email.png), then Varbase Starter !90 in #3637289, which points at it.

AI-Generated: Yes

rajab natshah’s picture

rajab natshah
he/him
commented

rajab natshah’s picture

rajab natshah
he/him
commented
Issue summary: View changes
Status: Needs review » Fixed
Issue tags: +vartheme_bs5-5.0.10

✅ Released in vartheme_bs5 5.0.10

Now that this issue is closed, review the contribution record.

As a contributor, attribute any organization that helped you, or if you volunteered your own time.

Maintainers, credit people who helped resolve this issue.