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
.zipaté 5–200 MB (conforme o plano) (um único ficheiro.htmltambém serve). - No interior: um ficheiro
.htmlpor página, os seus ficheiros.css, imagens e SVG. Cada.htmltorna-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
- Junte tudo numa pasta: as páginas (
index.html,sobre-nos.html…), as folhas de estilo e uma pastaimages. - Use caminhos relativos (
images/logo.png,sobre-nos.html). As ligações entre páginas são convertidas em ligações do WordPress. - Mantenha o CSS em ficheiros
.cssem vez de atributosstyleem linha: é lido com mais fiabilidade. - 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
- Na app, clique em Novo projeto.
- Escreva um nome e fique no separador Ficheiro.
- Arraste o
.zippara a zona de carregamento (ou clique para o escolher). - Clique em Criar projeto.
- 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
- Abra o projeto. Em Nova conversão, escolha o builder: Gutenberg (todos os planos) ou Elementor (a partir do Starter).
- Clique em Converter. Todas as páginas do projeto são convertidas; se uma falhar, as restantes concluem na mesma.
- 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)
- Na página da conversão, abra o separador Conteúdo e clique em Descarregar ficheiros (ou Copiar).
- 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.
- 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).
- Copie o conteúdo do seu ficheiro CSS para Aspeto → Personalizar → CSS adicional.
- Carregue as suas imagens para a Biblioteca de multimédia e verifique que aparecem na página.
- 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)
- Instale o plugin do Tapeto no seu site e copie a respetiva chave secreta — veja Instalação do plugin.
- 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.
- Abra a conversão concluída e clique em Publicar no WordPress. Escolha o site.
- 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á.
- 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.
- 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)
- Clique em Exportar WXR na página da conversão.
- No WordPress, vá a Ferramentas → Importar → WordPress, carregue o ficheiro e execute a importação.
- 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.