Documentation

Démarrer en trois minutes

1. 1. Connectez-vous sur app.myog.dev avec GitHub. Une clé publique est créée automatiquement.
2. 2. Collez l'URL dans une balise <meta property="og:image">.
3. 3. Vérifiez le rendu avec le validateur de la plateforme visée. Le premier appel génère l'image, les suivants la servent depuis le cache.

Paramètres

Les alias courts existent pour garder les URL lisibles dans le HTML. Ils produisent exactement la même image et la même entrée de cache que leur forme longue.

En-têtes de réponse

X-MyOG-Cache

HIT-EDGE, HIT-R2 ou MISS. Utile pour vérifier votre intégration.

X-MyOG-Render-Time

Durée du rendu en millisecondes. Absent sur un cache hit.

X-MyOG-Quota-Remaining

Images restantes sur le mois en cours.

X-MyOG-Image

embedded si la couverture a été incrustée, rejected:<raison> sinon. Présent seulement si vous avez passé image.

X-Request-Id

Identifiant de la requête, à nous communiquer en cas de problème.

Images de couverture

Les templates article, article-cover, article-pattern et article-mark réservent une colonne illustrée. Sans image, chacun y dessine sa propre composition — le motif d'article-pattern est d'ailleurs dérivé de votre titre, ce qui donne à chaque article un visuel qui lui est propre et ne change jamais. Avec image, votre visuel prend la place.

const og = new URL('https://api.myog.dev/v1/og');
og.searchParams.set('template', 'article-pattern');
og.searchParams.set('title', 'Mon article');
og.searchParams.set('image', 'https://exemple.com/photo.jpg?w=900&q=70');
og.searchParams.set('key', 'myog_pk_...');

searchParams.set encode la valeur pour vous. Concaténer la chaîne à la main casserait toute URL portant elle-même des paramètres : ses & seraient lus comme les nôtres.

• HTTPS et 512 Ko maximum. Demandez à votre CDN une taille adaptée — la colonne fait 456 px de large, 900 px de source suffisent.
• Deux secondes de patience. Au-delà, la composition générée est servie : votre carte reste correcte, elle n'affiche simplement pas la photo.
• Un échec n'est jamais une erreur. Le statut reste 200 et l'en-tête X-MyOG-Image en donne la raison. Une balise <meta> qui renvoie une erreur n'est pas réessayée par les robots sociaux.
• Le cache retombe à 24 heures. L'empreinte porte sur l'URL de l'image, pas sur son contenu : sans cela, remplacer le fichier derrière une URL inchangée laisserait votre carte figée un an.

Clés publiques et clés secrètes

Guides d'intégration

<meta property="og:image"
  content="https://api.myog.dev/v1/og?title=Mon+article&template=gradient&key=myog_pk_..." />
<meta property="og:image:width" content="1200" />
<meta property="og:image:height" content="630" />
<meta name="twitter:card" content="summary_large_image" />

// app/blog/[slug]/page.tsx
export async function generateMetadata({ params }) {
  const post = await getPost(params.slug);
  const og = new URL('https://api.myog.dev/v1/og');
  og.searchParams.set('title', post.title);
  og.searchParams.set('subtitle', post.excerpt);
  og.searchParams.set('template', 'article');
  og.searchParams.set('key', process.env.MYOG_PUBLIC_KEY!);

  return { openGraph: { images: [og.toString()] } };
}

---
const og = new URL('https://api.myog.dev/v1/og');
og.searchParams.set('title', Astro.props.title);
og.searchParams.set('key', import.meta.env.PUBLIC_MYOG_KEY);
---
<meta property="og:image" content={og.toString()} />

useSeoMeta({
  ogImage: () => {
    const og = new URL('https://api.myog.dev/v1/og');
    og.searchParams.set('title', post.value.title);
    og.searchParams.set('key', useRuntimeConfig().public.myogKey);
    return og.toString();
  },
});

add_action('wp_head', function () {
  if (!is_single()) return;
  $url = add_query_arg([
    'title'    => get_the_title(),
    'template' => 'article',
    'key'      => MYOG_KEY,
  ], 'https://api.myog.dev/v1/og');
  printf('<meta property="og:image" content="%s" />', esc_url($url));
});

Comment fonctionne le cache

Chaque combinaison de paramètres produit une empreinte. La première requête génère l'image et la stocke ; les suivantes la servent depuis le point de présence le plus proche. Deux URL équivalentes — mêmes valeurs dans un ordre différent, ou alias au lieu du nom long — partagent la même entrée de cache.

Votre clé API n'entre pas dans le calcul de l'empreinte. C'est volontaire : cela maximise le taux de cache, et c'est ce qui rend le plan gratuit soutenable.