ForHosting KIT · Immagini e foto

Immagine Open Graph

Questo strumento del KIT crea l'immagine di anteprima Open Graph di una pagina: quella che compare quando incolli il link in una chat o su un social. Parti da un modello con titolo, sfondo e logo e ottieni un PNG da 1200 × 630 pixel pronto da collegare con il meta tag og:image.

● Stabileper richiesta + per immagine$0.040

Esegui — $0.040 + $0.001/immagine Vedi l'API

Usalo da WebAPIEmailApp prestoTelegram presto

Esegui online

Esegui questo sui nostri server con il tuo account. Gli strumenti gratuiti girano nel tuo browser; questo viene addebitato sul tuo saldo KIT al prezzo indicato sopra.

Cos'è l'immagine Open Graph

Quando incolli il link di una pagina su WhatsApp, LinkedIn o Facebook, spesso compare un rettangolo con un'immagine, un titolo e una descrizione: quell'immagine è la Open Graph, indicata dalla pagina tramite il meta tag og:image. Se manca, il link appare spoglio o con un ritaglio casuale. Definirla bene significa controllare l'aspetto del tuo sito ogni volta che qualcuno lo condivide.

La misura giusta: 1200 × 630

Lo standard per l'anteprima è 1200 × 630 pixel, il formato che i social ritagliano correttamente su computer e telefono. Lo strumento produce direttamente questa misura, così eviti immagini schiacciate o tagliate male. Un'anteprima nella proporzione giusta si vede pulita ovunque venga mostrata, dalla chat al feed.

Da un modello a tante anteprime

Parti da un modello con lo sfondo, il logo e lo spazio per il titolo, e cambi solo il testo per ogni pagina: il titolo dell'articolo, il nome del prodotto, la data dell'evento. In questo modo tutte le anteprime del sito hanno la stessa impronta grafica ma un contenuto specifico, senza doverle disegnare una per una in un editor.

Come collegarla

Ottenuto il PNG, lo carichi sul sito e lo indichi nell'intestazione della pagina con il meta tag og:image, insieme a titolo e descrizione. Da quel momento chi condivide il link vede la tua anteprima. È l'ultimo passo che chiude il lavoro: l'immagine esiste, ma finché non la colleghi i social non sanno di doverla usare.

Costo e canali

L'anteprima viene composta rendendo un modello in un browser sui nostri sistemi, quindi la lavorazione ha un costo per immagine. La usi dal sito per una pagina singola o via API per generare in automatico l'anteprima di ogni articolo o prodotto man mano che li pubblichi.

Casi d'uso

Un blog con anteprime per articolo

Un blog vuole che ogni articolo condiviso mostri il proprio titolo su uno sfondo coerente. Da un modello genera l'immagine Open Graph di ciascun pezzo cambiando solo il testo, e i link condivisi appaiono curati.

Le schede prodotto di un e-commerce

Un negozio online condivide spesso i prodotti su WhatsApp. Con un'anteprima dedicata per ogni scheda, il messaggio mostra nome e immagine del prodotto invece di un riquadro anonimo.

La locandina social di un evento

Per un evento a Bologna serve un'anteprima con titolo e data. Generandola nella misura giusta, il link condiviso nei gruppi mostra subito di cosa si tratta.

Domande frequenti

Perché il mio link appare senza immagine?

Quasi sempre perché la pagina non indica un'immagine Open Graph con il meta tag og:image, oppure ne indica una di misura sbagliata. Generando l'anteprima corretta e collegandola con quel tag, i social smettono di mostrare un riquadro vuoto.

Che misura deve avere l'anteprima?

Lo standard è 1200 × 630 pixel, la proporzione che i social ritagliano bene su computer e telefono. Lo strumento produce direttamente questa dimensione, così l'immagine non risulta schiacciata o tagliata.

Quanto costa?

$0.040 a richiesta più $0.001 per ogni immagine generata, perché l'anteprima viene composta rendendo un modello in un browser. Paghi solo quello che generi, senza abbonamento.

I contenuti che invio restano riservati?

Il modello e i testi vengono elaborati per comporre l'immagine e poi eliminati dai nostri sistemi: non li conserviamo e non li usiamo per altro.

Ho aggiornato l'immagine ma sui social si vede ancora la vecchia. Perché?

I social conservano in cache le anteprime già viste. Dopo aver cambiato l'immagine devi chiedere alla piattaforma di rileggere il link con il suo strumento per gli sviluppatori, così aggiorna l'anteprima memorizzata.

Posso generarle in automatico per ogni pagina?

Sì. Via API produci l'anteprima di ogni articolo o prodotto man mano che lo pubblichi, cambiando solo il titolo e mantenendo lo stesso stile grafico.

Per sviluppatori — accesso via API

Tutto quello che vedi in questa pagina è disponibile anche via API. Questa sezione è per i team che vogliono integrarlo nei propri sistemi; chi non ne ha bisogno può semplicemente usare lo strumento qui sopra.

Endpoint

POSThttps://api.kit.forhosting.com/image/og

Autenticazione con Bearer token: un POST mette in coda l'attività e il risultato arriva via webhook o link firmato.

Chiamala dal tuo stack

curl -X POST https://api.kit.forhosting.com/image/og \
  -H "Authorization: Bearer $KIT_KEY" \
  -H "Content-Type: application/json" \
  -d &#39;{"image":"https://ejemplo.com/imagen.jpg"}'

const res = await fetch("https://api.kit.forhosting.com/image/og", {
  method: "POST",
  headers: {
    "Authorization": `Bearer ${process.env.KIT_KEY}`,
    "Content-Type": "application/json"
  },
  body: JSON.stringify({
    "image": "https://ejemplo.com/imagen.jpg"
  })
});
const { task_id } = await res.json();

import os, requests

res = requests.post(
    "https://api.kit.forhosting.com/image/og",
    headers={"Authorization": f"Bearer {os.environ[&#39;KIT_KEY']}"},
    json={
    "image": "https://ejemplo.com/imagen.jpg"
},
)
task_id = res.json()["task_id"]

<?php
$res = file_get_contents("https://api.kit.forhosting.com/image/og", false, stream_context_create([
  "http" => [
    "method"  => "POST",
    "header"  => "Authorization: Bearer " . getenv("KIT_KEY") . "\r\nContent-Type: application/json",
    "content" => &#39;{"image":"https://ejemplo.com/imagen.jpg"}',
  ],
]));
$task = json_decode($res, true);

body := bytes.NewBufferString(`{"image":"https://ejemplo.com/imagen.jpg"}`)
req, _ := http.NewRequest("POST", "https://api.kit.forhosting.com/image/og", body)
req.Header.Set("Authorization", "Bearer "+os.Getenv("KIT_KEY"))
req.Header.Set("Content-Type", "application/json")
res, _ := http.DefaultClient.Do(req)

Esempio di richiesta

{
  "image": "https://ejemplo.com/imagen.jpg"
}

Esempio di risposta

{
  "task_id": "tsk_a1b2c3d4e5f6a1b2c3d4e5f6",
  "type": "image.og",
  "status": "queued",
  "_links": {
    "result": "/tasks/tsk_…/result"
  }
}

L'API è asincrona: ricevi subito un task_id e puoi fare polling fino a 1 richiesta al secondo.

Prezzi

per richiesta$0.040

per immagine$0.001

Prezzo pubblicato, senza token né crediti. Se l'attività fallisce, non paghi.

Limiti

`max_mb`	15
`max_megapixels`	12

Errori

HTTP	Codice	Significato
`401`	`unauthorized`	Chiave API mancante o non valida: controlla l'header Authorization.
`402`	`insufficient_balance`	Credito esaurito: ricarica per continuare a eseguire attività.
`404`	`unknown_type`	Tipo di attività sconosciuto: controlla il campo type della richiesta.
`429`	`rate_limited`	Troppe richieste in poco tempo: rallenta e riprova tra qualche secondo.
`422`	`task_failed`	L'attività non è andata a buon fine: non ti viene addebitato nulla.

Leggi la documentazione completa del KIT →