Configuração dos parâmetros de funcionalidades do Elementor

Elementor é um editor de sites WordPress poderoso e intuitivo que oferece aos usuários ferramentas para criar e personalizar sites com facilidade. Como um editor visual avançado, permite projetar diversos elementos de página através do sistema de arrastar e soltar, possibilitando a criação de sites altamente personalizados, profissionais e visualmente atraentes.

Este artigo apresenta uma explicação básica sobre a configuração do Elementor, ajudando os leitores a entender melhor as funções do Elementor antes de editar páginas do WordPress, reduzindo assim problemas de uso causados por configurações inadequadas. Abaixo está o índice de conteúdo organizado pelo autor, e os leitores podem também clicar nos links do índice para leitura direcionada.

• Estilo do painel administrativo do WordPress após a instalação do Elementor
• Configurações Gerais
• Integrações
• Configurações Avançadas
• Recursos

um、 O estilo após a instalação do Elementor

Após a instalação do plugin Elementor, será gerado um ícone de configuração correspondente na barra lateral do painel administrativo do WordPress. Este artigo se concentra principalmente na explicação da configuração dos parâmetros de função do Elementor; quanto à funcionalidade de modelos localizada sob o ícone do Elementor, o autor irá abordá-la detalhadamente em capítulos separados sob a categoria de aprendizado técnico do Elementor, portanto, será ignorada neste momento. Ao posicionar o cursor sobre o ícone do Elementor, será exibido um menu com todas as opções de configuração do Elementor conforme mostrado na imagem; clique em "Configurações" no menu de funções para acessar a página de configuração dos parâmetros.

dois、Configurações Gerais

Tipos de Postagem

Refere-se às páginas e tipos de postagem que serão editados usando o Elementor. Mantenha o padrão, a menos que haja necessidades específicas, não é necessário alterar esta configuração.

Desativar Cores Padrão

A descrição do Elementor para esta função já é bastante clara: ao selecionar esta caixa, os estilos de cor dos elementos durante a edição de páginas herdarão as configurações do tema. Esta opção deve ser marcada conforme a necessidade. Durante a edição de páginas, o autor prefere marcar para aumentar a eficiência, configurando previamente as cores no tema.

Desativar Fontes Padrão

Se não houver necessidade de usar fontes personalizadas, geralmente esta opção não deve ser marcada, permitindo que o Elementor herde os estilos de fonte do tema. Para empresas na China, tanto para sites em chinês quanto em outros idiomas, não é recomendado usar fontes especiais devido a políticas de conexão de rede no país. Caso haja problemas na conexão de fontes externas, isso poderá impactar a velocidade de carregamento do site.

Melhorar o Elementor

Esta opção não está relacionada a funções específicas de uso, mas serve para que o Elementor colete alguns dados de utilização para aprimorar o plugin. Marcar ou não fica a critério do usuário. O autor, como profissional de Customer Success, costuma aceitar esse tipo de solicitação quando não há prejuízo para si.

três、Integração Elementor

As configurações de integração pertencem a um uso mais avançado do Elementor, permitindo conectar APIs de outros aplicativos ou sistemas para realizar troca de dados com aplicativos de terceiros. Antes de explicar as integrações específicas, o autor compartilha uma experiência pessoal para evitar desperdício de tempo: servidores domésticos na China não conseguem usar APIs do Google devido a problemas de conexão. Portanto, APIs do Google não devem ser conectadas em servidores nacionais. Em servidores no exterior, não há este problema.A seguir, explicaremos duas integrações comuns: Stripe e MailChimp.

Integração do Elementor com MailChimp e Stripe

Role para baixo na página de integrações do Elementor e você verá as opções de integração com MailChimp e Stripe. Antes de prosseguir, certifique-se de obter a API Key (chave de interface) dos aplicativos. Basta copiar e colar a API Key no campo correspondente. Após preencher, clique no botão "Validate Test API Key" abaixo do campo para validar a chave. Se a validação for bem-sucedida, clique em "Salvar Alterações" no final da página. Se você já estiver no modo de edição do Elementor, será necessário sair e entrar novamente para que as novas integrações funcionem corretamente.

quatro、Configurações Avançadas

Nas configurações avançadas, além da questão das fontes do Google, o restante pode ser mantido como padrão. A fonte do Google geralmente deve ser desativada pelos seguintes motivos:

• Se o servidor for na China para sites em chinês, o carregamento da fonte na inicialização do site pode causar atrasos devido a problemas de rede.
• Se o servidor estiver fora da China para sites estrangeiros, você ainda poderá notar alguma lentidão ao acessar da China.Vale destacar que o fato de você sentir lentidão não significa que os usuários de fora da China também terão a mesma experiência — isso depende da rede.

cinco、Funcionalidades

A seção de funcionalidades do Elementor está mais relacionada a HTML e CSS. As funcionalidades são divididas em duas categorias: funcionalidades em fase experimental e funcionalidades estáveis. A maioria está habilitada por padrão. Independentemente disso, o autor selecionará e explicará as funcionalidades mais importantes.

Container Grid

Este é um tipo de container, chamado de container grid. Usar um container grid para expandir o número de linhas e colunas da grade é muito conveniente, mas no modo de edição do Elementor, ele carece de flexibilidade, como a incapacidade de realizar aninhamento hierárquico da grade e a impossibilidade de personalizar os parâmetros de linhas e colunas individuais. Mesmo que a função Grid não seja a escolha do autor para criar containers, é aconselhável ativá-la.

Container Flexbox

O container Flexbox, como o nome sugere, é um container flexível e é o tipo de container que o autor mais utiliza para criar. Ele permite o aninhamento hierárquico de containers e a personalização do tamanho dos sub-containers, oferecendo layouts de página flexíveis. Sem dúvida, essa função deve ser ativada.

Carregamento de Imagens de Fundo com Atraso

Esta é uma função do Elementor para otimizar o desempenho da página. Quando essa função está ativada, as imagens carregadas no modo de edição, exceto as imagens da tela inicial, serão carregadas com atraso. Isso ajuda a melhorar significativamente a velocidade de carregamento da tela inicial, já que as imagens não são carregadas de forma síncrona. Esta função também melhora a pontuação LCP do Core Web Vitals, sendo um excelente parâmetro de otimização de desempenho. No entanto, essa função ainda está em fase experimental no momento em que o autor escreve este artigo, e todas as funções experimentais podem ter incompatibilidade com outros plugins. Portanto, é aconselhável ativá-la com cautela.

Saída de DOM Otimizada

DOM significa "Modelo de Objeto de Documento", também conhecido como árvore DOM, que é a representação hierárquica da estrutura do HTML. A função de saída DOM otimizada do Elementor melhora automaticamente a estrutura e a marcação do HTML, tornando o código mais compatível com os padrões do W3C. Se você não tiver código HTML personalizado, ativar essa função para otimizar o código HTML é uma boa escolha.

Quebra de Ponto Personalizada Adicional

Para explicar essa função, precisamos entender o que é uma "quebra de ponto". No desenvolvimento de páginas web, isso pode ser entendido como o intervalo de pixels para vários tamanhos de tela. Em desenvolvimento de aplicativos, refere-se ao intervalo de execução do programa. Após compreender o que significa quebra de ponto no desenvolvimento de páginas, é possível entender melhor esta função. Ela permite personalizar os tamanhos de tela da página que está sendo editada no Elementor, como os tamanhos de tela para dispositivos móveis, tablets e desktop. Esta função precisa ser ativada.

Carregamento Aprimorado de CSS

Esta função pode otimizar de forma eficaz o modo de carregamento do código CSS. O princípio é carregar o CSS de forma assíncrona ou com atraso, reduzindo renderizações desnecessárias ao acessar a página, o que melhora a velocidade de carregamento da página. No entanto, o Elementor também menciona que essa função pode ser incompatível com outros plugins, por isso o autor recomenda ativá-la com cautela ou desativá-la caso ocorram problemas após a ativação.

Por fim, se você tem pouco tempo e o custo de investimento em aprendizado e prática técnica é alto, e não tem interesse em se aprofundar em trabalhos técnicos, este artigo pode servir apenas para ajudá-lo a entender a configuração básica do Elementor e o funcionamento do editor de páginas do WordPress. Se você não pretende realizar as operações por conta própria, mas deseja que o trabalho técnico seja feito por uma equipe mais experiente, recomendamos que você escolha um serviço profissional. A equipe da Logic Digital Technology é especializada em criação de sites WordPress e desenvolvimento técnico. Se precisar de design e desenvolvimento de sites WordPress, fique à vontade para entrar em contato com a equipe da Logic Digital Technology, e nós forneceremos soluções eficientes e profissionais.

Logic Digital Technology (SZLOGIC) - Todos os direitos reservados, reprodução proibida.