Menu da documentação

Converter um site ZIP / HTML

Passo a passo: transforme um ZIP com HTML, CSS e imagens em páginas WordPress, com uma conta Free e com uma conta paga.

É o caminho mais completo: o Tapeto converte todas as páginas do ZIP, mantém as ligações entre elas e pode publicar o site inteiro. Está disponível em todos os planos, incluindo o Free. Um design do Figma ou do Penpot exportado como HTML também serve aqui.

Antes de começar

  • Um .zip até 5–200 MB (conforme o plano) (um único ficheiro .html também serve).
  • No interior: um ficheiro .html por página, os seus ficheiros .css, imagens e SVG. Cada .html torna-se uma página do WordPress.
  • O seu WordPress, se quiser publicar: HTTPS, ligações permanentes «Nome do artigo» (Definições → Ligações permanentes) e, para o Gutenberg, um tema de blocos como o Twenty Twenty-Five.

Passo 1 — Prepare o ZIP

  1. Junte tudo numa pasta: as páginas (index.html, sobre-nos.html…), as folhas de estilo e uma pasta images.
  2. Use caminhos relativos (images/logo.png, sobre-nos.html). As ligações entre páginas são convertidas em ligações do WordPress.
  3. Mantenha o CSS em ficheiros .css em vez de atributos style em linha: é lido com mais fiabilidade.
  4. Selecione o conteúdo da pasta e comprima-o num .zip.

O que esperar dos ficheiros

O HTML é analisado tal como é entregue. O conteúdo que um script constrói depois de a página carregar (alguns menus, sliders) pode não ser detetado. As imagens são carregadas para o WordPress em jpg, png, gif ou webp até 6 MB cada; os SVG enviados como ficheiros soltos não são carregados, mas o SVG escrito dentro do HTML é mantido.

Passo 2 — Crie o projeto

  1. Na app, clique em Novo projeto.
  2. Escreva um nome e fique no separador Ficheiro.
  3. Arraste o .zip para a zona de carregamento (ou clique para o escolher).
  4. Clique em Criar projeto.
  5. Aguarde até o estado do projeto ser «processado». Se terminar em «erro», a mensagem explica o que corrigir.

Passo 3 — Escolha o builder e converta

  1. Abra o projeto. Em Nova conversão, escolha o builder: Gutenberg (todos os planos) ou Elementor (a partir do Starter).
  2. Clique em Converter. Todas as páginas do projeto são convertidas; se uma falhar, as restantes concluem na mesma.
  3. Quando a conversão estiver concluída, abra-a e veja o Fidelity Score e a Pré-visualização.

Cada conversão destina-se a um só builder. Para ter o mesmo site em Gutenberg e em Elementor, lance duas conversões no mesmo projeto.

Passo 4 — Leve o resultado para o WordPress

Conta Free (Gutenberg, à mão)

  1. Na página da conversão, abra o separador Conteúdo e clique em Descarregar ficheiros (ou Copiar).
  2. No WordPress, vá a Páginas → Adicionar nova. Abra o menu de três pontos → Editor de código e cole o conteúdo. Volte ao editor visual.
  3. Se o seu design tiver cabeçalho e rodapé, abra o separador Header / Footer / Sidebar, descarregue cada parte e cole-a na parte de modelo correspondente em Aspeto → Editor (editor de código).
  4. Copie o conteúdo do seu ficheiro CSS para Aspeto → Personalizar → CSS adicional.
  5. Carregue as suas imagens para a Biblioteca de multimédia e verifique que aparecem na página.
  6. Repita para cada página. O separador Instruções mostra os passos exatos para o seu builder.

As contas Free não podem usar Exportar WXR nem Publicar no WordPress; os botões aparecem bloqueados.

Conta paga (Starter, Pro, Agency, Studio)

Escolha uma das duas opções.

Opção A — Publicar no WordPress (a mais rápida)

  1. Instale o plugin do Tapeto no seu site e copie a respetiva chave secreta — veja Instalação do plugin.
  2. Na app, vá a Ligações WP, adicione o URL do seu site e cole a chave. Use o botão de teste até indicar uma ligação válida.
  3. Abra a conversão concluída e clique em Publicar no WordPress. Escolha o site.
  4. Se o painel mostrar conteúdo dinâmico encontrado no seu design (artigos de blogue, produtos, tipos personalizados), escolha para cada um conteúdo real do WordPress ou manter o design tal como está.
  5. Clique em Publicar. O Tapeto carrega as imagens, cria cada página como rascunho, reescreve as ligações entre páginas, adiciona o seu CSS em CSS adicional e carrega as Google Fonts usadas.
  6. No WordPress abra Páginas, reveja os rascunhos e publique-os. Para usar a página inicial como página principal: Definições → Leitura → Uma página estática.

Opção B — Exportar WXR (sem plugin)

  1. Clique em Exportar WXR na página da conversão.
  2. No WordPress, vá a Ferramentas → Importar → WordPress, carregue o ficheiro e execute a importação.
  3. Reveja as páginas, os menus e o cabeçalho / rodapé importados.

No Agency e no Studio, o WXR inclui ainda os tipos de conteúdo personalizados e os loops. Instale o Plugin de CPT (descarregue-o na página da conversão) e ative-o antes de importar o WXR.

Elementor

A saída do Elementor precisa do Elementor ativo no site de destino (a versão gratuita chega). O cabeçalho e o rodapé são colocados dentro de cada página, porque o Elementor gratuito não tem partes de tema partilhadas.

Limites conhecidos

  • Os formulários têm o mesmo aspeto mas não enviam: ligue um plugin de formulários e substitua o bloco.
  • O menu móvel (hambúrguer) e as animações em JavaScript do original não são transferidos.
  • Publicar de novo cria páginas novas; não substitui as existentes. Apague primeiro os rascunhos antigos.
  • Os sites cujo conteúdo é gerado por inteiro por uma framework de JavaScript podem converter-se pior.

Passo seguinte

Conheça melhor o analisador em Converter designs HTML/CSS, ou veja todas as opções de saída em Exportar resultados.