OG Kit — сервіс для генерації динамічних Open Graph зображень за допомогою вашого HTML і CSS. Розроблений Peter Suhm, він дозволяє визначати шаблони OG-зображень прямо в кодовій базі замість покладання на зовнішні дизайн‑інструменти або headless browser‑налаштування.
Додаєте тег <template> з розміткою OG-зображення на будь-яку сторінку, підключаєте клієнтський скрипт OG Kit — сервіс рендерить і кешує зображення. Щоб переглянути шаблон у браузері, додайте ?ogkit-render до URL і в інструментах розробника підправляйте його в реальному часі.
<template data-og-template>
<div style="width: 1200px; height: 630px; display: flex; align-items: center; justify-content: center;">
<h1>{{ $post->title }}</h1>
</div>
</template>
<script src="https://cdn.jsdelivr.net/npm/ogkit@1"></script>
Оскільки шаблони — звичайний HTML і CSS, можна використовувати наявні стилі, шрифти, зображення та вашу систему шаблонів. Ніякої власної DSL вивчати не потрібно.
OG Kit має офіційний пакет для Laravel, що підтримує версії 10, 11 і 12:
composer require petersuhm/ogkit-laravel
Пакет автоматично знаходить свій service provider, тому додаткових налаштувань після встановлення не потрібно.
Ось приклад шаблону:
<body>
<article>
<h1>{{ $post->title }}</h1>
<p>{{ $post->excerpt }}</p>
</article>
@ogTemplate
<div class="w-full h-full bg-slate-900 text-white p-16 flex flex-col justify-end">
<p class="text-xl opacity-80">{{ config('app.name') }}</p>
<h1 class="mt-6 text-6xl font-bold">{{ $post->title }}</h1>
<p class="mt-4 text-2xl">{{ $post->excerpt }}</p>
</div>
@endOgTemplate
</body>
Працює також з Inertia; усю документацію з інтеграції з Laravel дивіться тут.
OG Kit пропонує безкоштовний тариф на 25 сторінок; платні плани починаються від $99/рік за 1 000 сторінок. Усі плани включають кешовані зображення та необмежену кількість доменів. «Сторінка» означає унікальний URL, де OG Kit генерує й розміщує OG-зображення.
| План | Ціна | Сторінки |
|---|---|---|
| Безкоштовний | $0 | 25 сторінок |
| Базовий | $99/рік | 1 000 сторінок |
| Pro | $299/рік | 10 000 сторінок |
| Індивідуальний | Зверніться до відділу продажів | Вищі ліміти |
Деталі — на сайті OG Kit або в пакеті для Laravel на GitHub.
Хочете забезпечити повну прозорість у своїх Laravel-додатках? Пакет Laravel Audit Log допоможе вам детально відстежувати всі зміни моделей Eloquent та відповідати вимогам регуляторів. Читайте далі, щоб дізнатися, як цей потужний інструмент може підвищити надійність вашого проєкту
У сучасній веб-розробці аутентифікація є ключовою для захисту додатків і даних користувачів. Дізнайтеся, як модуль nuxt-sanctum-authentication спростить інтеграцію між Nuxt 3 та Laravel Sanctum, забезпечуючи надійний і зручний спосіб реалізації аутентифікації для вашого проєкту
PHP 8.5 обіцяє безліч нових можливостей, таких як оператор Pipe, функції `array_first()` та `array_last()`, а також нове розширення URI. Чи готові ви дізнатися, як ці функції можуть спростити вашу розробку? Читайте далі, щоб дізнатися більше про ці захоплюючі нововведення