Skip to main content
Não tens de descrever cada pequena alteração ao agente: podes trabalhar diretamente na pré-visualização do teu projeto. Clica num elemento para lhe mudares o aspeto, reescreve o texto no próprio sítio ou desenha uma marca sobre a página para mostrares ao agente do que estás a falar. As edições visuais trabalham sempre com um elemento concreto. Escolhes um elemento na página, vês as definições disponíveis para ele e alteras tudo ali mesmo. As alterações de design e de texto são escritas no projeto quando guardas, sem passarem pelo agente e sem gastarem créditos.
Disponível em todos os planos
As edições visuais só funcionam no computador. A barra de ferramentas não aparece no telemóvel nem em janelas de navegador estreitas.

A barra de ferramentas

A barra de ferramentas sobre a pré-visualização, com Editar design, Editar texto e Anotação Sobre a pré-visualização em direto do teu projeto flutua uma barra com três ferramentas:
  • Editar design: Clica em qualquer elemento para mudares o aspeto, a imagem ou o layout.
  • Editar texto: O texto editável fica contornado, basta clicares nele e reescrevê-lo.
  • Anotação: Desenha na página para mostrares do que estás a falar.
Com Esc voltas a qualquer momento à navegação normal da pré-visualização. Se a barra de ferramentas tapar um elemento que queres editar, clica em Ocultar barra de ferramentas. A ferramenta continua ativa e as alterações por guardar mantêm-se.

Editar design

Quando ativas Editar design, o painel abre com Estilos do site, onde defines os tipos de letra, o arredondamento dos cantos e as cores de todo o site. Clica num elemento da página para abrires as definições dele. Em textos, imagens e secções vês primeiro as opções básicas. Alinhamento, contornos, sombra, espaçamento e disposição estão em Avançado. Um título selecionado na pré-visualização, com as definições abertas no painel da esquerda Com o seletor de tema no cabeçalho do painel verificas o resultado em modo claro e escuro antes de guardares.

Reordenar e ajustar o espaçamento

Para mover um elemento, seleciona-o e arrasta a pega por baixo dele para outro sítio, por exemplo para trocar dois cartões de lugar. Também podes usar as teclas de seta. Para alterar o espaçamento, arrasta as pegas na parte inferior do elemento selecionado. Ambas as alterações são guardadas ou descartadas com o resto das tuas edições.
Os elementos só se movem dentro do seu próprio grupo. Os itens gerados a partir de uma lista, como produtos ou artigos de blog, não podem ser arrastados. Pede ao agente para os reordenar.

Editar texto

O texto que podes reescrever fica contornado diretamente na pré-visualização. Clica lá dentro e escreve. É a forma mais rápida de corrigir um título ou um parágrafo, porque vês o resultado no sítio enquanto escreves.

Anotação

Às vezes é mais rápido mostrar ao agente o que queres dizer do que descrevê-lo. Com a Anotação ligada, desenha sobre a parte da página de que estás a falar. O Macaly percebe que elementos ficam por baixo da tua marca e junta-os à tua mensagem seguinte. Desenha as marcas que precisares, escreve depois a mensagem e envia-a como de costume. Enquanto desenhas, tens Desfazer marca, Refazer marca e Limpar à mão na própria barra. Uma marca desenhada à volta do título e do parágrafo, com a etiqueta Anotação por cima da mensagem As anotações servem para apontar, não para deixar comentários. Não ficam guardadas com o projeto e não custam nada além da mensagem que envias.
Guarda ou descarta as alterações de design antes de começares a anotar e não mudes o tamanho da pré-visualização enquanto desenhas. Ao mudares o tamanho, as marcas desaparecem, porque estão ancoradas ao sítio onde o conteúdo estava.
Clicar exatamente naquilo que queres nem sempre é possível, sobretudo quando os elementos se sobrepõem ou um elemento aninhado tapa aquele que o contém. Por cima da tua seleção aparece uma pequena barra que te deixa subir um nível ou passar com as setas para os elementos vizinhos. Aí encontras também o ícone de código, que abre o código-fonte do elemento no separador Código, e a opção de remover o elemento por completo.

Editar com IA

Em textos e imagens, o painel também te permite descrever uma alteração em vez de a configurares. Reescrever com IA reescreve o texto conforme pedires. Gerar com IA edita a imagem atual ou cria uma nova, e vês o resultado antes de o usares. Com um elemento selecionado, também o campo de mensagem do chat passa a editar esse elemento. Tudo o que escreveres ali aplica-se apenas à tua seleção atual.
Os botões de IA no painel e as mensagens enviadas pelo chat gastam créditos como qualquer outro pedido à IA, e o painel mostra o preço antes de os executares. Tudo o que definires à mão no painel é gratuito.

Guardar as alterações

Enquanto tiveres alterações por guardar, a barra mostra quantas são e podes guardá-las todas de uma vez com Guardar ou anulá-las com Descartar. A barra com cinco alterações por guardar, com Descartar e Guardar Guardar não passa pelo agente, por isso é imediato e não custa créditos. Se a alteração for mais exigente, o Macaly passa-a ao agente no chat, onde se comporta como qualquer outra mensagem.

Quando a barra de ferramentas não está disponível

A barra esconde-se, ou fica cinzenta, quando a edição direta não funcionaria:
  • Espera que o Macaly termine: O agente ainda está a trabalhar no teu projeto.
  • À espera que a pré-visualização esteja pronta: A pré-visualização ainda está a arrancar.
  • Fecha o plano para editar a página: Tens um plano aberto no chat.