---
title: "Crie o seu primeiro widget com o AI Widget Builder"
description: "Como criar o seu primeiro widget no EmbedSocial com o AI Widget Builder."
---

O seu conteúdo já está na sua conta. Agora vamos transformá-lo num widget que pode colocar no seu site. A forma mais rápida é o **AI Widget Generator**: basta escrever um prompt que descreva o design que imagina e a nossa IA cria o widget por si em segundos.

Antes de criar o widget, certifique-se de que tem as suas fontes conectadas (por exemplo, avaliações do Google, Instagram, TikTok, etc.) no separador '**Fontes**'. Se ainda não o fez, comece por [Conecte a sua primeira fonte](/docs/getting-started/connect-source/).

## Como criar o seu primeiro widget com IA

:::steps
1. **Crie um widget.** Vá à secção '**Widgets**', clique no botão '**+ Novo widget**' e escolha a opção '**Gerar com IA**'.
![A página Widgets com os botões Gerar com IA e Novo widget](https://embedsocial.com/images/docs/create-widget/manage-widgets.jpg)
2. **Escreva o seu prompt.** Selecione a sua fonte, descreva exatamente o que precisa e clique em '**Gerar**'. Por exemplo: "Crie um widget com cartões flutuantes suaves que se elevem ligeiramente ao passar o cursor. Use cores pastel suaves e sombras mínimas."
![A descrever um widget no AI Widget Builder](https://embedsocial.com/images/docs/create-widget/create-ai-widget-embedsocial.jpg)
3. **Melhore o seu prompt (opcional, recomendado).** Clique no botão '**Melhorar**' junto ao campo do prompt para que a IA transforme o seu prompt simples num conjunto detalhado de instruções. Pode rever, editar ou remover partes específicas antes de gerar.
4. **Aplique o seu Brand Theme (opcional).** O editor com IA deteta as cores da marca do seu site e pergunta-lhe no chat se as quer aplicar. Confirme para aplicar subtilmente as cores da sua marca em todo o widget ou ignore este passo para manter as cores predefinidas do modelo.
5. **Melhore o design.** Para mudar algo no primeiro widget gerado, escreva um novo prompt. Pode ser mais específico e dar mais detalhes sobre o que imaginou.
![A melhorar o widget gerado com as sugestões de personalização da IA](https://embedsocial.com/images/docs/create-widget/ai-widget-editor-embedsocial.jpg)
:::

> Não atualize a página enquanto a IA gera o seu widget. Se o fizer, o widget volta ao design anterior.

## Prefere começar a partir de um modelo?

Também pode criar um widget escolhendo um dos modelos prontos a usar e personalizando-o no editor. [Saiba como usar e personalizar os modelos de widgets](/docs/widgets/templates/).

## Perguntas frequentes

**Q: Isto consome os meus créditos de IA?**

Sim, gerar um widget consome créditos de IA. Uma ação de IA = um crédito de IA.

**Q: Posso alterar o widget depois de a IA o criar?**

Claro que sim. Assim que a IA gera o seu widget, pode escrever um novo prompt e enviá-lo.

**Q: Posso criar vários widgets a partir de fontes diferentes?**

Sim, pode criar vários widgets dentro da sua conta, cada um a partir de uma fonte diferente ou de uma combinação de fontes.

**Q: O que acontece se ocorrer um erro durante a geração?**

Se vir o erro "Unable to generate HTML", aparece um botão Retry diretamente no chat. Clique nele para reenviar o seu prompt com um único clique.

## O que se segue

O seu widget está pronto. É altura de o publicar: [Incorpore o seu widget no seu site](/docs/getting-started/embed/).

> Se tiver alguma questão, clique no ícone de chat no canto inferior direito para falar com a nossa equipa de apoio ao cliente ou envie-nos um email para [support@embedsocial.com](mailto:support@embedsocial.com). Estamos aqui para si 🙏