# Sites headless

> Widgets do leitor em sites que não usam o tema do WordPress (Next.js, Astro e outros).

No WordPress clássico, o plugin coloca os widgets do leitor sozinho. Se o site do portal usa outro front-end (o WordPress só como painel), a equipe técnica inclui um script na página da matéria. O plugin continua instalado no WordPress, para a redação usar os módulos e enviar as matérias.

## Na página da matéria

```html
<meta name="sevn-ai:article" content="{ID do post no WordPress}">
<script src="https://api-publishers.sevntech.com/embed/v1/sevn-ai.js" data-site="{chave pública do site}" async></script>
<div id="sevn-ai-top"></div>
<!-- ... texto da matéria ... -->
<div id="sevn-ai-bottom"></div>
```

- `#sevn-ai-top`: player do Áudio e Resumo Em 30 Segundos.
- `#sevn-ai-bottom`: Leia também e Pergunte ao Portal.
- Para pôr cada widget num lugar diferente, use `<div data-sevn-ai="audio">`, `"summary"`, `"related"` ou `"ask"`.
- Em vez da tag `meta`, o ID da matéria pode ir no próprio script, em `data-article`.

O script só mostra o que o plano do portal inclui e o que já foi aprovado. Se um módulo não está no plano ou não há conteúdo, o espaço fica vazio, sem quebrar a página. O visual herda a fonte e as cores do site e funciona no modo escuro.

## Pergunte só para assinantes

Se o Pergunte for só para assinantes, o site precisa dizer quem é assinante. Acrescente ao script:

- `data-reader`: endereço do seu site que devolve `{"token": "..."}` para o assinante logado;
- `data-login`: página de login, para o convite a quem não está logado.

O token vale por até 2 horas e é assinado com a chave de API do portal, no servidor (nunca no navegador). A equipe técnica da SEVN passa o formato exato.
