hardimpactdev/og-image-filament

Generate code-configured Open Graph images from Filament resource records.

0.1.0 2026-07-18 06:20 UTC

Requires

• php: ^8.4
• filament/filament: ^5.6
• illuminate/contracts: ^13.0
• spatie/browsershot: ^5.4
• spatie/laravel-package-tools: ^1.93

Requires (Dev)

• larastan/larastan: ^3.9
• laravel/pint: ^1.27
• orchestra/testbench: ^11.0
• pestphp/pest: ^4.4
• pestphp/pest-plugin-arch: ^4.0
• pestphp/pest-plugin-laravel: ^4.1
• phpstan/extension-installer: ^1.4
• phpstan/phpstan-deprecation-rules: ^2.0
• phpstan/phpstan-phpunit: ^2.0

MIT

• Nick Retel

• laravel
• HardImpact
• og-image-filament

Published on Packagist.org on 2026-07-18 06:33 UTC

README

Generate deterministic 1200 × 630 Open Graph images from Filament resource records.

Every resource owns its Blade template, DTO resolver, and storage path in application code. The Filament page is a read-only previewer with source and entry selection plus manual regeneration.

Installation

composer require hardimpactdev/og-image-filament
php artisan migrate

Create an application DTO:

<?php

declare(strict_types=1);

namespace App\Data\OgImages;

use App\Models\Article;

final readonly class ArticleOgImageData
{
    public function __construct(
        public string $label,
        public string $title,
        public string $description,
        public string $url,
    ) {}

    public static function from(Article $article): self
    {
        return new self(
            label: 'Article',
            title: $article->title,
            description: $article->description,
            url: url("/articles/{$article->slug}"),
        );
    }
}

Register the plugin on a Filament panel:

use App\Data\OgImages\ArticleOgImageData;
use App\Filament\Resources\ArticleResource;
use App\Models\Article;
use Filament\Panel;
use HardImpact\OgImageFilament\OgImageFilamentPlugin;
use HardImpact\OgImageFilament\Sources\ResourceSource;

public function panel(Panel $panel): Panel
{
    return $panel->plugin(
        OgImageFilamentPlugin::make()
            ->sources([
                ResourceSource::make(ArticleResource::class)
                    ->template('og-images.articles')
                    ->dataUsing(
                        fn (Article $article): ArticleOgImageData => ArticleOgImageData::from($article),
                    )
                    ->pathUsing(
                        fn (Article $article): string => "articles/{$article->getKey()}.png",
                    ),
            ]),
    );
}

The package passes the resolved DTO to Blade as $data:

<article style="width: 1200px; height: 630px">
    <p>{{ $data->label }}</p>
    <h1>{{ $data->title }}</h1>
    <p>{{ $data->description }}</p>
    <p>{{ $data->url }}</p>
</article>

Templates and DTOs belong to the consuming application, so changes remain versioned in Git and deploy with the app. Missing templates, resolvers, paths, and render failures throw immediately.

Models that implement GeneratesOgImages and use InteractsWithOgImages regenerate synchronously after each committed save. Deleting the model removes its PNG before the database row is deleted. Generation and deletion failures propagate to the caller.

Configuration

OG_IMAGE_DISK=public
OG_IMAGE_DIRECTORY=og-images
OG_IMAGE_NODE_BINARY=/path/to/node
OG_IMAGE_CHROME_PATH=/path/to/chrome
OG_IMAGE_NO_SANDBOX=false

Set OG_IMAGE_NO_SANDBOX=true only when Chromium runs as root inside a trusted container.

Development

composer test
composer analyse
vendor/bin/pint --test

License

MIT