Тема

OG-изображения для записей в блоге

OG-изображение для записей в блоге — это изображение социального превью размером 1200×630, которое отображается, когда кто-то делится вашей статьёй в X, LinkedIn, Facebook, Slack или WhatsApp. FastOG генерирует его динамически по запросу на основе заголовка, отрывка и автора вашей записи — без дизайнерской работы, без загрузки файлов, без подписок, без входа в систему для начала работы.

Зачем каждому посту в блоге нужно собственное OG-изображение

Ссылка, опубликованная без карточки или с устаревшей универсальной карточкой, теряется среди остальных постов. Карточка для каждого поста с реальным заголовком и аккуратным макетом приносит больше репостов и переходов. Именно из-за затрат на ручную генерацию карточки для каждого поста большинство блогов ограничивается одним изображением по умолчанию — эту проблему как раз и решает FastOG.

Как получить динамическое OG-изображение для поста в блоге

Вы подписываете URL во время рендеринга страницы с помощью template=blog, заголовка поста, отрывка и автора. Социальный краулер запрашивает его, FastOG один раз рендерит PNG, а Cloudflare кэширует его, поэтому каждый последующий шеринг происходит мгновенно и бесплатно.

tsx
// Next.js App Router — app/blog/[slug]/page.tsx
export async function generateMetadata({ params }) {
    const post = await getPost(params.slug);
    return {
        title: post.title,
        openGraph: {
            images: [generateOgImageUrl({
                template: "blog",
                title: post.title,
                subtitle: post.excerpt,
                author: post.author.name,
            })],
        },
    };
}

Используйте template=blog для выделенной карточки блога с автором и заголовком или default для более чистого макета только с заголовком. Все шаблоны рендерятся в формате 1200×630.

Какой шаблон подходит для вашего блога

Если ваш блог… Используйте шаблон Преимущество
Показывает автора и анонс blog строка автора включена
В основном состоит из заголовка и слогана default минималистичный, ориентированный на бренд
Использует фото или обложку editorial / image-right макет с акцентом на фото
Публикует анонсы запусков или продуктов launch поля версии и домена

FAQ

Сколько стоит FastOG для постов в блоге?

Один рендер на уникальное изображение; идентичные URL кэшируются на периферии (edge) навсегда и не учитываются в вашей месячной квоте.

Нужно ли перегенерировать изображение при редактировании поста?

Только если меняются заголовок, выдержка или автор — URL зависит от содержимого, поэтому изменение содержимого приводит к новому URL и новому рендеру. Неизменный URL остается в кэше и не учитывается в вашей квоте.

Могу ли я использовать FastOG с моим существующим фреймворком для блога?

Да. Готовые подписанты (signers) существуют для Next.js, React, SvelteKit, Vue/Nuxt, Astro, Express, Vanilla Node.js, JavaScript, PHP/Laravel, Python и Ruby/Rails. См. страницу SDK.

Попробуйте бесплатно — регистрация не требуется

Предпросмотр и тестирование динамических OG-изображений за секунды.

Открыть бесплатный тестер OG-изображений

A BeCaSimulations site