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.
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.
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
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.
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
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.
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.
Primeiro, crie uma nova página e edite-a com o elementor. Em seguida, clique na pasta de modelos mostrada na imagem acima.
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.