Inserisci una scheda meteo in tempo reale su qualsiasi sito web con una sola riga di codice: nessun backend meteo da creare, nessuna chiave API esposta nel browser. Perfetto per annunci immobiliari, pagine di viaggi ed eventi, location e dashboard.
Il problema
Se gestisci un sito web, mostrare il meteo locale in tempo reale di solito significa registrarsi a un’API meteo, scrivere codice lato server per farle da proxy, memorizzare le risposte nella cache per non esaurire la quota e tenere le chiavi fuori dal codice lato client. È un vero e proprio progetto. E tu volevi solo una scheda.
Come funziona
Incorpora un elemento personalizzato e il gioco è fatto:
<script
src="https://app.weatherintouch.com/embed.js"
data-api-base="https://api.weatherintouch.com"
></script>
<wx-weather-card
lat="50.08"
lon="14.44"
lang="en"
theme="auto"
></wx-weather-card>
La scheda viene renderizzata all’interno di un Shadow DOM, quindi i suoi stili non entrano mai in conflitto con il CSS del tuo sito. Mostra le condizioni attuali e, facoltativamente, delle brevi previsioni. Preferisci un iframe? C’è una variante che adatta automaticamente la propria altezza tramite postMessage. La configurazione avviene interamente tramite attributi: coordinate, lingua, tema e la tua chiave API.
Perché è diverso
- Cache condivisa. Il tuo widget legge dalla stessa cache delle previsioni dell’app principale. Una scheda sul tuo sito e la scheda dell’app principale di un visitatore alle stesse coordinate costano una sola chiamata a monte, non due.
- Nessuna fuga di chiavi. L’endpoint batch del backend fornisce i dati; la tua chiave API ha un ambito limitato ed è vincolata all’origine, non è mai una chiave grezza del provider esposta nella pagina.
- Nessuna interferenza di stile. L’isolamento dello Shadow DOM fa sì che la scheda abbia lo stesso aspetto su ogni sito.
- Lista di origini consentite per tenant. Controlli esattamente quali domini possono renderizzare la tua scheda.
Prezzi
Il widget incorporabile è una funzionalità Pro: include una chiave API per tenant e una lista di origini consentite per poterlo distribuire su tutte le tue proprietà.
FAQ
Come lo incorporo? Aggiungi il tag script e un elemento <wx-weather-card> con le tue coordinate, oppure usa la variante iframe.
Elemento personalizzato o iframe? L’elemento personalizzato si integra in modo più stretto (temi, layout); l’iframe è la soluzione più isolata e immediata da inserire.
Posso personalizzare il tema? Sì: theme="auto|light|dark" e la scheda rispetta il tuo colore di accento dove applicabile.
Quali sono i limiti di frequenza? L’endpoint batch è soggetto a throttling e dà priorità alla cache; l’incorporamento normale rimane ampiamente entro i limiti perché le coordinate identiche vengono deduplicate.
Devo citare Weather InTouch? Sì: la scheda contiene un piccolo link di attribuzione, in linea con i termini dei nostri fornitori di dati.