• Recursos
  • Modelos
  • Preços
  • Portuguese
  • Recursos
  • Modelos
  • Preços
  • Portuguese

Third-Party Plugins (44)

Estatísticas do bbPress
Profissional
Formulário de resposta do bbPress
Profissional
Índice do fórum do bbPress
Profissional
Formulário de fórum do bbPress
Profissional
Tags de tópico do bbPress
Profissional
Formulário de tópico do bbPress
Profissional
Fórum único do bbPress
Profissional
Tópico único do bbPress
Profissional
bbPress Resposta única
Profissional
Tag única do bbPress
Profissional
Carrossel do LearnPress
Profissional
Grade do LearnPress
Profissional
EDD Product Review Carousel
Profissional
Avaliações de produtos EDD
Profissional
Mini carrinho EDD
Profissional
Carrinho EDD
Profissional
Grade de categorias EDD
Profissional
Produto EDD
Profissional
Grade de cursos do Tutor LMS
Grátis
Totais de doações
Profissional
Dar Meta
Profissional
Give Histórico de doações
Profissional
Give Donor Wall
Profissional
Grade do formulário de doação
Profissional
Dar recibo
Profissional
Editor de portfólio do EDD
Profissional
Histórico do EDD
Profissional
Grade do calendário de eventos
Grátis
Grade de depoimentos
Grátis
Download do Monitor
Profissional
Galeria de portfólio / Grade
Profissional Popular
Perfil filantrópico
Profissional
Estatuto de caridade
Profissional
Registro de caridade
Profissional
Login beneficente
Profissional
Formulário de doação beneficente
Profissional
Doações filantrópicas
Profissional
Doadores filantrópicos
Profissional
Campanhas beneficentes
Profissional
Calendly
Grátis
Grupo BuddyPress
Profissional
Amigos do BuddyPress
Profissional
Membro do BuddyPress
Profissional
bbPress
Profissional
Ops! Seu widget pesquisado não foi encontrado! Você tem alguma ideia? Se sim, Enviar aqui

Como converter um modelo HTML em um modelo de página Elementor - 4 etapas fáceis

Convert HTML Template to Elementor

Os modelos são a maneira mais rápida de importar designs para uma página da Web. Muitos não sabem como converter HTML em modelo de página Elementor. Como resultado, as coisas se tornam mais complicadas. Para resolver esse problema, mostraremos como você pode criar facilmente um modelo Elementor.

Enquanto criamos o modelo, você deve se lembrar de que precisamos de uma página predefinida. É claro que você pode criar uma página da Web agora mesmo e começar a trabalhar com ela. Estaremos projetando nossa página no Elementor.

No entanto, para este evento, estamos usando widgets criados por Element Pack. Não deixe de ler este blog na íntegra para saber como converter HTML em um modelo de página do Elementor.

Etapa 1: Criar a página do modelo

Antes de tudo, precisamos criar nossa página. Vamos entrar nela.

Designing page for converting HTML template to Elementor

Vá para sua Painel de controle do WordPress> Páginas> Adicionar nova.

Dê um nome à sua página e clique em Editar com Elementor. Agora, sua página será aberta no editor Elementor.

Open HTML in Elementor page

Em seguida, crie sua página como desejar. Na imagem acima, criamos a página usando os widgets Heading, Scroll Nav, Advanced Button, Search e Slider. Esses widgets de complemento do elementor são todos feitos pelo Element Pack. Agora, temos nossa página pronta para ser convertida em um modelo de página do Elementor.

Etapa 2: Conversão para o modelo de página Elementor

Converting HTML template into Elementor page template

Para criar um modelo, precisamos executar algumas etapas. Primeiro, siga a imagem acima e clique em Save as Template (Salvar como modelo) na parte inferior do menu do lado direito. Você precisa clicar na seta ao lado do botão Update (Atualizar) para que a opção apareça. Essa é a primeira etapa para criar o modelo de página do Elementor.

save the elementor template

Em seguida, uma nova janela pop-up será exibida. A partir daí, você pode dar um nome ao seu modelo e clicar em Salvar. Seu modelo será salvo na biblioteca do Elementor.

Alguns usuários também perguntam se há um conversor on-line de html para elementor ou um plugin de html para elementor para simplificar o processo. Embora o Elementor não tenha um conversor direto, você pode criar e salvar facilmente seus designs seguindo estas etapas.

Etapa 3: Exportar o modelo para a unidade local

Exporting Template into local drive

Ao salvar o modelo, sua biblioteca de modelos será exibida. A partir daí, clique nos pontos marcados em seu modelo recém-criado. Você verá duas opções. Agora, clique em Importar.

import elementor json template

Seu modelo será baixado e salvo no formato Json. Agora, você pode colocar esse arquivo em seu diretório local > wp-content > templates. Esse arquivo também é conhecido como arquivo json do modelo elementor.

Ao salvar o arquivo dessa forma, você poderá acessar esse modelo em qualquer painel do WordPress.

Se estiver trabalhando com HTML personalizado, você poderá ver guias sobre html para json elementor ou html para elementor jsonmas o Elementor lida com a maior parte disso automaticamente ao exportar e importar modelos.

Melhor solução da Web: Deseja impulsionar seu site com nosso produto?

Etapa 4: Inserir o modelo de página do elementor

Você tem o arquivo Json do modelo em seu diretório local, o que significa que ele está na biblioteca do WordPress agora. Agora, vamos ver como você pode inseri-lo em sua página.

Inserting the elementor page template

Primeiro, crie uma nova página e edite-a com o elementor. Em seguida, clique na pasta de modelos mostrada na imagem acima.

insert the template into new elementor page

Agora, você pode ver sua biblioteca de modelos. A partir daí, passe o mouse sobre seu modelo, clique em Insert (Inserir) e pressione Yes (Sim). 

É isso aí! Seu modelo do Elementor aparecerá em sua página, em vez de HTML. Isso é particularmente útil se você estiver procurando converter sites em elementor ou reutilizar designs.

Como ocultar o elemento html na página do Elementor?

Se você não quiser converter o modelo HTML em elementor, poderá ocultá-lo temporariamente, para que possa recuperar a versão html. 

Veja abaixo as etapas mais fáceis para ocultar o modelo html na página do Elementor:

Etapa 1: Vá para sua Página Elementor e selecione o widget html do elementor.
Etapa 2: Na barra de menu à esquerda, clique em Avanço guia.

Etapa 3: Role a tela para baixo e localize o menu Responsive na lista.
Etapa 4: Ative a opção de ocultar para desktop, celular, tablet, conforme sua necessidade.

É isso aí. Seus modelos HTML não serão exibidos em sua página do Elementor. No entanto, é uma ocultação temporária, você pode torná-la visível a qualquer momento, bastando desativar a alternância.

Perguntas frequentes:

Como visualizar o código-fonte HTML da página criada com o Elementor?

Clique com o botão direito do mouse na página e clique em "View Page Source". Isso mostra o Elemento html estrutura.

Como editar HTML no Elementor?

Procure por HTML no menu à esquerda. Use o botão código html do elementor e, após a edição, pressione Publicar para salvar as alterações.

Como adicionar código HTML no WordPress Elementor?

Insira o código html do wordpress elementor ou o bloco widget html do elementor e adicione o código entre .

Posso exportar os designs do Elementor como HTML?

Sim, mas o Elementor exporta JSON por padrão. Você precisará de ferramentas ou métodos manuais para converter a página do elementor em htmlou exportar elementor para html.

Conclusão

Converter HTML em modelo de página do Elementor ou simplesmente exportar seu design Elementor como JSON não é uma tarefa difícil e você também pode fazer isso. Você só precisa seguir as etapas corretamente.

Alguns usuários preferem o processo inverso e procuram um conversor de elementor para html ou maneiras de exportar página do elementor para html. Nesses casos, você pode usar a função de salvar do navegador ou plug-ins que converter elementor em html.

Este blog é patrocinado por Element PackO pacote de widgets completo para Elementor. Obrigado por ler este blog. Tenha um bom dia.

Leia também:

Deixe uma resposta

Tabela de conteúdo

Direitos autorais © 2025 BdThemes. Todos os direitos reservados.

Money Transfer Logo