Guias/Layout do site/Editar o design de um site criado por IA

Editar o design de um site criado por IA

Depois de criar seu site com o Construtor de sites com IA, você pode personalizar o design e o layout usando prompts de IA. Este guia mostrará como usar IA para finalizar o design do seu site.

Essa funcionalidade está disponível em sites novos com os nossos planos Premium e Negócios do WordPress.com. Você pode experimentar gratuitamente (até 30 prompts) e fazer upgrade para publicar e continuar personalizando o site.

Editar um site criado por IA

Você pode continuar atualizando, editando e adicionando conteúdo ao seu site com IA e editando manualmente. Para trabalhar em seu site com IA:

  1. Acesse a página Sites.
  2. Selecione seu site e clique no botão “Minha página inicial“.
  3. A próxima etapa depende do plano do site:
    • Sites de teste gratuito chegarão diretamente no editor para retomar a edição.
    • Os sites com upgrade chegarão no painel do site, onde você pode navegar para Aparência → Editor para retomar a edição.
  4. Clique no ícone de estrela de quatro pontas na parte inferior da tela para abrir o assistente de IA:
The AI symbol that resembles a four-pointed star.

Alterar o esquema de cores geral

Para atualizar o esquema de cores do seu site usando IA, siga estas etapas:

  1. Clique no ícone de IA (estrela de quatro pontas) para abrir a caixa de prompt.
  2. Digite um prompt, como: “Altere as cores” ou “Quero alterar o esquema de cores de todo o site para tons pastéis.
  3. Você receberá paletas de cores para experimentar. Clique em uma cor para ver como fica a atualização no seu site.
  4. Depois de selecionar o esquema de cores desejado, clique no botão Salvar para salvar a alteração.

Para escolher manualmente um esquema de cores, vá até Aparência → Editor → Estilos → Cores e selecione uma nova paleta de cores (indisponível no teste gratuito).

A caixa de prompt da IA diz "suggest new colors for my website" (sugira novas cores para meu site), e a IA forneceu sugestões de esquema de cores para você escolher.

Alterar uma cor específica

Se você gosta do esquema de cores geral do site, mas quer alterar a cor de uma seção ou elemento específico, siga estas etapas:

  1. Clique no elemento (como um texto ou botão) ou seção específica que você deseja alterar.
  2. Abra a caixa de prompt de IA.
  3. Digite a solicitação de mudança de cor. Você pode descrever a cor ou solicitar um código de cor específico:
    “Mude este botão para amarelo brilhante”
    “Defina o plano de fundo do título com a cor #FFB514”
  4. Clique no botão Salvar para salvar a alteração ou no ícone de seta para trás para desfazê-la.

Adicionar novas seções

Você pode adicionar novas seções ao layout de uma página:

  1. Clique na seção onde você deseja adicionar uma nova seção.
  2. Abra a caixa de prompt de IA.
  3. Digite o prompt, como:
    “Adicione uma seção de depoimentos abaixo de Sobre”.
    “Insira uma seção de tabela de preços na página inicial.”
  4. Revise a nova seção. A IA fornece vários layouts para você explorar usando os botões de seta para a esquerda e para a direita.

Reordenar seções

Altere o layout do seu site movendo as seções:

  1. Clique na seção que deseja mover.
  2. Abra a caixa de prompt de IA.
  3. Digite:
    “Posicione a seção Serviços acima de Depoimentos.”
    “Mova a seção Contato para o topo.”

Se for necessário um ajuste fino, selecione uma seção manualmente usando a Visualização em lista. Aparecerá uma barra de ferramentas com setas para cima e para baixo para mover a seção selecionada para uma nova posição:

Uma nova seção com as setas de posicionamento destacadas para movê-la.
Use os ícones de seta para mover uma seção para cima ou para baixo

Remover uma seção ou elemento específico

Exclua seções ou elementos indesejados em poucas etapas:

  1. Clique na seção ou elemento que deseja remover.
  2. Abra a caixa de prompt de IA.
  3. Digite:
    “Remova a seção de perguntas frequentes da página inicial.”
    “Exclua o bloco de galeria adicional na seção Sobre.”
  4. Clique no botão Salvar para salvar a alteração ou no ícone de seta para trás para desfazê-la.

Você também pode remover blocos manualmente, basta selecioná-los, clicar no ícone ⋮ e escolher a opção Excluir.

Mais prompts de design

Ao criar sites com IA, as possibilidades são infinitas. Veja outros exemplos de mudanças no design que você pode pedir para a IA fazer por você:

  1. Altere a paleta de cores para tons de azul e cinza.
  2. Deixe todos os botões arredondados e azuis.
  3. Atualize a cor de fundo para branco.
  4. Troque a fonte para uma mais moderna e sem serifa.
  5. Use uma fonte grande e em negrito em todos os títulos.
  6. Adicione uma seção em destaque na página inicial.
  7. Altere o layout para uma única coluna.
  8. Reorganize o rodapé para mostrar primeiro os links de redes sociais.
  9. Adicione uma seção de chamada para ação acima do rodapé.
  10. Altere o estilo do menu para uma barra lateral vertical.
  11. Aumente o tamanho do logotipo do site no cabeçalho.
  12. Adicione uma seção de depoimentos abaixo do conteúdo principal.
  13. Use um layout de grade para as imagens da galeria.
  14. Adicione um formulário de inscrição na newsletter na parte inferior da página.
  15. Mantenha a barra de navegação fixa no topo.
  16. Adicione mais espaço em branco entre as seções.
  17. Centralize os títulos em todas as páginas.
  18. Use um plano de fundo claro com texto escuro em todo o site.
  19. Adicione sombras leves às imagens.
  20. Aumente o espaçamento entre os parágrafos.
  21. Altere a ordem das seções na página inicial.
  22. Torne redondas as imagens dos membros da equipe.
  23. Use um gradiente colorido no plano de fundo da página.
  24. Adicione ícones à seção de serviços.
  25. Use cores pastéis no plano de fundo.
  26. Coloque uma fonte com estilo manuscrito em todos os títulos.
  27. Adicione um divisor entre cada seção.
  28. Use botões de chamada para ação grandes e em negrito.
  29. Coloque todos os títulos em letras maiúsculas.
  30. Adicione uma seção de introdução na parte superior de cada página.
Copied to clipboard!