Adicione um cartão meteorológico em tempo real a qualquer website com uma única linha de código — sem necessidade de criar um backend de meteorologia, nem de expor chaves de API no browser. Perfeito para anúncios imobiliários, páginas de viagens e eventos, locais e dashboards.
O problema
Se gere um website, mostrar a meteorologia local em tempo real significa, normalmente, registar-se numa API de meteorologia, escrever código de servidor para servir de proxy, colocar as respostas em cache para não esgotar a sua quota e manter as chaves fora do código do lado do cliente. Isso é um projeto inteiro. E você só queria um cartão.
Como funciona
Incorpore um elemento personalizado e já está:
<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>
O cartão é renderizado dentro de um Shadow DOM, pelo que os seus estilos nunca entram em conflito com o CSS do seu site. Mostra as condições atuais e, opcionalmente, uma breve previsão. Prefere um iframe? Existe uma variante que ajusta automaticamente a altura através de postMessage. A configuração é toda feita por atributos — coordenadas, idioma, tema e a sua chave de API.
Porque é diferente
- Cache partilhada. O seu widget lê da mesma cache de previsões que a app principal. Um cartão no seu site e um separador da app principal de um visitante nas mesmas coordenadas custam apenas uma chamada a montante — e não duas.
- Sem fuga de chaves. O endpoint em lote do backend serve os dados; a sua chave de API tem um âmbito definido e restrição de origem, nunca sendo uma chave de fornecedor em bruto exposta na página.
- Sem conflito de estilos. O isolamento do Shadow DOM significa que o cartão tem o mesmo aspeto em qualquer site.
- Lista de origens permitidas por conta. Pode controlar exatamente quais os domínios que podem renderizar o seu cartão.
Preços
O widget incorporável é uma funcionalidade Pro — inclui uma chave de API por conta e uma lista de origens permitidas para que o possa implementar em todas as suas propriedades.
FAQ
Como o incorporo? Adicione a tag do script e um elemento <wx-weather-card> com as suas coordenadas — ou utilize a variante iframe.
Elemento personalizado ou iframe? O elemento personalizado tem uma integração mais profunda (temas, layout); o iframe é o mais isolado e a opção mais simples de implementar.
Posso personalizar o tema? Sim — theme="auto|light|dark" e o cartão respeita a sua cor de destaque onde aplicável.
Quais são os limites de pedidos? O endpoint em lote tem limite de tráfego e dá prioridade à cache; a incorporação normal mantém-se perfeitamente dentro dos limites porque as coordenadas idênticas são desduplicadas.
Preciso de dar crédito ao Weather InTouch? Sim — o cartão inclui um pequeno link de atribuição, de acordo com os termos dos nossos fornecedores de dados.