O que você vai montar
Com o Framer conectado, os artigos gerados no ClickHunt entram direto numa coleção do CMS do seu site Framer, com título, corpo, resumo, título SEO, capa, data, categorias, tags e autor. As imagens passam a ser hospedadas no próprio Framer. A conexão usa o link do projeto e uma chave de API criada no Framer.
Disponível a partir do plano Pro. Só o dono ou um administrador do projeto consegue configurar.
Antes de começar
- Uma coleção de CMS para os posts, criada por você no Framer (por exemplo, "Blog"). Ela precisa ter um campo de texto para o título e um campo de texto formatado (formatted text) para o corpo. Coleções criadas por plugins não aparecem, porque o Framer só deixa ler essas coleções.
- Uma página de detalhe da coleção no site, se você quiser que o ClickHunt mostre o link de cada post publicado.
- Saiba que publicar um artigo publica o site. O CMS do Framer não publica um item sozinho: para o post ir ao ar, o site inteiro é publicado. Se houver alterações de design pendentes no projeto, elas vão ao ar junto, e o ClickHunt avisa quais páginas mudaram.
Passo 1: copie o link do projeto
- Abra o projeto no editor do Framer.
- Copie o endereço da barra do navegador. Ele fica assim:
https://framer.com/projects/Meu-Site--a1b2c3d4e5f6g7h8i9j0 - Esse link inteiro serve. Também vale só o ID de 20 caracteres do final.
Passo 2: crie a chave de API
- Com o projeto aberto no Framer, aperte Cmd + K (Mac) ou Ctrl + K (Windows) e digite
open settings. Ou clique na engrenagem de configurações do site. - Na aba General, procure a seção API Keys.
- Crie uma chave nova com um nome fácil de reconhecer, por exemplo
ClickHunt. - Copie a chave.
Passo 3: cole no ClickHunt
- No projeto, abra Configurações › Integrações, seção Hospedagem.
- No card Framer, clique no ícone de engrenagem (Configurar).
- Preencha:
- Link do projeto: o endereço copiado no passo 1.
- Chave de API: a chave copiada no passo 2. Ela fica guardada cifrada e nunca aparece de volta na tela.
- Clique em Conectar. O status fica Verificando enquanto o ClickHunt lê as coleções do projeto.
Passo 4: escolha a coleção e os campos
Depois da verificação, a engrenagem do card mostra a configuração da coleção. Cada escolha é salva na hora.
- Em Coleção do blog, escolha a coleção dos posts. Se você acabou de criar a coleção no Framer e ela não aparece, clique em Atualizar coleções.
- Em Campos da coleção, confira para onde vai cada parte do artigo. O ClickHunt já sugere os campos que reconhece pelo nome, mas confirme cada um. Cada parte só oferece os campos do tipo certo:
- Título (obrigatório): campo de texto.
- Corpo do artigo (obrigatório): campo de texto formatado.
- Resumo: texto ou texto formatado.
- Título SEO: texto.
- Imagem de capa: imagem.
- Data de publicação: data.
- Categorias e Tags: campo de opções (option) ou referência a outra coleção.
- Autor: texto ou referência a outra coleção.
- Se a coleção tiver campos obrigatórios que nenhuma parte preenche, a tela mostra quais são. Torne-os opcionais no Framer ou mapeie-os.
- Com título e corpo mapeados, o card passa para Pronto para ativar.
- Para os próximos artigos irem para o Framer, clique no botão principal Conectar do card e confirme. O card passa para Conectado.
O que vai para o Framer
- Texto. O artigo completo, com títulos, listas, tabelas e FAQ, no campo de texto formatado.
- Imagens. A capa e as imagens do corpo são enviadas para o Framer e passam a carregar de lá. Se alguma falhar, ela continua aparecendo no artigo, carregando do ClickHunt, e o ClickHunt avisa. Publicar de novo leva a imagem para o Framer.
- Categorias. São ligadas pelo nome às opções ou aos itens que já existem no Framer (até 10). O ClickHunt não cria categoria: se faltar, crie no Framer com o mesmo nome.
- Tags. Criadas se não existirem (até 30).
- Autor. Num campo de texto, vai o nome do autor. Num campo de referência, o ClickHunt procura o autor pelo nome na coleção de autores; se não achar, o campo fica vazio e aparece um aviso.
- Data e título SEO. Nos campos que você mapear.
- Rascunhos. Um artigo em rascunho no ClickHunt entra na coleção como rascunho, sem publicar o site.
- Exclusão. Excluir o artigo no ClickHunt apaga o item da coleção no Framer. Se ele estava no ar, o site é publicado de novo sem ele.
Staging: se o projeto do Framer tiver o ambiente de staging ativado, os artigos são publicados em staging. Para irem para o site de produção, promova a publicação no próprio Framer.
Mensagens de erro
| Mensagem | O que fazer |
|---|---|
| Isso não parece um link de projeto do Framer | Copie de novo o endereço da barra do navegador com o projeto aberto (framer.com/projects/…). |
| O Framer recusou esta chave de API | A chave foi revogada. Crie outra (passo 2) e cole de novo. |
| A chave conecta, mas não tem permissão para escrever no CMS ou publicar o site | Confira as permissões da chave no Framer ou crie uma nova. |
| Nenhuma coleção encontrada neste projeto | Crie uma coleção no CMS do Framer e clique em Atualizar coleções. |
| A coleção do Framer exige campos que não sabemos preencher | Torne esses campos opcionais na coleção ou mapeie-os no passo 4. |
| Já existe um post com este endereço (slug) na coleção do Framer | Existe um post com o mesmo slug, criado fora do ClickHunt. Mude o slug do artigo aqui ou do post lá. |
| O Framer recusou a gravação no CMS | Confira se a coleção ainda existe e se a chave tem permissão de escrita. |
| O Framer teve um problema ao processar a publicação | Tente de novo em alguns minutos. |
Perguntas frequentes
Posso editar o post direto no Framer? Pode, mas a próxima vez que o artigo for salvo no ClickHunt, ele sobrescreve o post. Prefira editar no ClickHunt.
Por que publicar um artigo levou junto uma mudança de layout? Porque o Framer publica o site inteiro. O ClickHunt mostra um aviso com as páginas que tinham alterações pendentes. Para evitar, publique ou desfaça as alterações de design no Framer antes de publicar artigos.
Como desconecto? Na engrenagem do card, clique em Desconectar. Os posts já publicados continuam no ar. Para cortar o acesso pelo lado do Framer, apague a chave em Site Settings › General › API Keys.