Logo Manager
Everything Flarum's logo setting will not do. Upload an SVG. Make the logo bigger and let the header grow with it. Centre it. Recolour it, pixelate it, give it a shadow. Put a santa hat on it in December and take it off again in January, without touching anything.
Free and MIT licensed. No core files are patched, and
no JavaScript is loaded on the forum at all — the whole appearance is one stylesheet composed on the server and inlined into
<head>, so the header is already the right size in the first paint.
Why I built it
Flarum's logo is a single upload field, and it does three things people keep running into. These aren't opinions — they're lines in
flarum/core:
- "My SVG won't upload."
AbstractImageValidator::getAllowedTypes() allows jpeg, jpg, png, bmp, gif, webp. SVG is rejected twice: once by the MIME allow-list, once by getimagesizefromstring().
- "My logo is blurry when I make it bigger."
UploadLogoController::makeImage() re-encodes every upload to WebP scaled to height: 60. The large file you uploaded is not the file being served.
- "I can't make the logo bigger."
.Header-logo { max-height: 30px } and --header-height: 52px sit in core's compiled CSS with no setting attached to either.
The usual workaround for the first one is to edit
logo_path in the database by hand — which works right up until somebody uses the admin uploader again, and does nothing about the other two.
A logo that's actually the size you asked for
Set 88px and the header grows with it, so nothing overflows and nothing is clipped. There's a separate height for the phone drawer, and you can pin the header height yourself if you'd rather.
Centred, in flow
Centring moves the navigation to the left of the logo and the account controls to the right. It's done with flex rather than absolute positioning, so a crowded header pushes the logo off-centre instead of covering your links with it.
Effects, applied live
Nothing is baked into the file, so every effect works on an SVG and a photograph alike, and turning one off restores the original exactly.
Flat recolour keeps the logo's shape and fills it with one colour — the quick fix for a dark logo on a dark header, with no second file to maintain:
There's also pixelate (no CSS filter exists for it, so it's done with real SVG filter primitives), grayscale, sepia, invert, saturation, brightness, contrast, hue rotate, blur, opacity, a drop shadow, a background plate, and a hover behaviour. Six presets to start from.
Seasons that run themselves
Give the logo a different look for part of the year. Each season can carry its own logo, its own effects, an ornament pinned to a corner, and weather drifting across the header.
- Date ranges including ones that wrap the new year, and moving dates — Easter, US and Canadian Thanksgiving, Lunar New Year, Mother's and Father's Day — with a window of days either side.
- 16 ornaments and 8 weather types, all drawn in code. The extension ships no image files, so there's nothing to 404, nothing to publish, and nothing a cache clear can take away.
- 14 starting points included, from Christmas to Pride Month to your forum's own birthday.
- Rules are dragged to reorder and the first match wins, so Christmas Day can sit above a broad December rule and take precedence for one day without either rule knowing about the other.
About SVG uploads
Core refuses SVG for a real reason, and accepting it means taking that job on.
An SVG served from your own domain is a document on your own origin: it can carry
<script>, an
onload= attribute, a
javascript: link, or a
<foreignObject> full of HTML. None of that runs inside the
<img> that draws your header — but the file also sits at a plain URL under
/assets, and anything that gets somebody to open that URL directly is running script as your forum.
So every uploaded SVG is parsed and stripped of everything outside a strict allow-list before it is written to disk, using
enshrined/svg-sanitize, with remote references removed as well — a logo has no business fetching anything, and one that phones home on every page view is both a privacy leak and a way for its contents to change later without you knowing.
Uploads are admin-only and capped at 512 KB for SVG, 8 MB for raster. Raster dimensions are read from the file header
before anything decodes the image, so a small file declaring enormous dimensions can't exhaust memory.
If you write themes
Logo Manager stays out of the way until it's configured: with the default sizes it emits no header rules at all, so installing it doesn't change a themed header. The overrides appear only once an admin has actually set a size.
Once configured it takes ownership of
--header-height and the header's own height
together (including
min-height, which a
height alone can't beat) — winning one and losing the other is what slides page content underneath a fixed header. Its rules carry one extra unit of specificity so the result doesn't depend on which extension's
<style> block the server emitted last. That's deliberately only one unit: your own custom CSS can still override any of it with
!important.
Weather animation is disabled under
prefers-reduced-motion: reduce. The particles stay; they just stop moving.
Installation
composer require ernestdefoe/logo-manager
php flarum cache:clear
Then
Administration → Logo Manager.
Requires Flarum 2.0+ and PHP 8.3+.
Links
Feedback and bug reports very welcome — particularly from theme authors, since the header is a busy place and I'd rather hear about a clash than have people quietly uninstall.
