Configuração e configuração de pontos de interrupção de elementadores personalizados por complementos mestres #
O grátis Pontos de interrupção personalizados para Elementor plugin de Master Addons (3 breakpoints personalizados gratuitos, ilimitados com Master Addons Pro) permite criar layouts de sites totalmente responsivos otimizado para tamanhos de tela além das visualizações de dispositivos integradas da Elementor Isso garante uma experiência de usuário consistente e de alta qualidade em qualquer dispositivo.
Usando Pontos de Interrupção de Elementor Personalizados, você pode:
- Adicione quantos pontos de interrupção personalizados (larguras de tela) forem necessários (ilimitados com Master Addons Pro).
- Defina layouts específicos, tamanhos de fonte, espaçamento e alinhamento para dispositivos como Small Mobile, Large Tablet ou tamanhos de tela personalizados.
- Substitua o comportamento responsivo padrão do Elementor em larguras de pixels precisas.
O que são pontos de interrupção de elementos personalizados? #
Os pontos de interrupção personalizados do Elementor são larguras de tela extras definidas pelo usuário que permitem que seu layout se adapte em tamanhos que as visualizações integradas do Elementor não cobrem Elementor tem até sete visualizações de dispositivos (Retrato móvel, Paisagem móvel, Retrato de tablet, Paisagem de tablet, Laptop, Desktop e Widescreen).Um ponto de interrupção personalizado adiciona outro na largura máxima exata que você escolher, por exemplo, uma visualização móvel pequena de 600 px. Os complementos mestres somam 3 pontos de interrupção personalizados no plano gratuito e pontos de interrupção ilimitados com o Pro, dando-lhe controle preciso sobre o design responsivo sem tocar no código.
Então, vamos ver como configurar e configurar esse recurso.
Configurando pontos de interrupção de elementos personalizados #
Resposta rápida: instale a extensão Pontos de interrupção personalizados de Complementos Mestres > Extensão, abra o novo Pontos de interrupção página sob o menu Complementos Mestres e, em seguida, insira a Largura máxima em pixels para cada tamanho de dispositivo que você deseja segmentar (por exemplo, 600 px para celular pequeno).
Siga estas etapas para instalar e definir seus pontos de interrupção personalizados.
Passo 1: Instale e Ative a Extensão #
- Navegar até ao Adições Mestres menu no seu painel WordPress.
- Ir para o Extensão guia.
- Encontre o “Pareceres Personalizados” opção e clique no botão de download para instalar e ativá-lo em seu site.
Passo 2: Acesse as configurações de pontos de interrupção #
- No painel do WordPress, passe o mouse sobre o Adições Mestres menu.
- Um novo item de menu intitulado “Breakpoints” irá aparecer Clique nele Isto irá redirecioná-lo para a página de entrada de ponto de interrupção personalizado.
Passo 3: Adicionar Pontos de interrupção personalizados #
Na página de entrada Pontos de interrupção, você verá seus pontos de interrupção ativos do Elementor e seus intervalos de pixels.
Para adicionar um novo ponto de interrupção personalizado, use o campo de entrada para definir apenas o Largura máxima (em pixels).
Por exemplo, para segmentar pequenos dispositivos móveis, entre 600px como a largura máxima.
Após salvar, o sistema ajustará automaticamente o Min-Width para o próximo ponto de interrupção padrão No exemplo acima, o ponto de interrupção “Small Mobile” será aplicado a todas as telas menor ou igual a 600px, enquanto o ponto de interrupção padrão do “Mobile” começará em 601px e termine na largura mínima do ponto de interrupção do Tablet.
Você pode adicionar ou remover pontos de interrupção conforme necessário nesta página.
Usando pontos de interrupção de elementos personalizados #
Uma vez configurados nas configurações de complementos mestres, os pontos de interrupção personalizados ficam disponíveis diretamente no editor de páginas do Elementor.
Etapa 1: Abra o modo responsivo no elementor #
Vá para qualquer página e clique em “Editar com Elementor.” Clique no Modo Responsivo ícone (geralmente um monitor e ícone de telefone) na parte inferior esquerda do painel.
Passo 2: Selecione um ponto de interrupção personalizado #
A barra superior exibirá todos os pontos de interrupção disponíveis, incluindo os personalizados que você criou (por exemplo, “Small Mobile”).
Clique no seu Ponto de interrupção personalizado para alterar a visualização do editor para esse tamanho de tela específico.
Passo 3: Aplique estilos personalizados #
Selecione qualquer elemento (por exemplo, um widget Cabeçalho).
Vá para o elemento Estilo guia.
Clique no Ícone Responsivo (monitor de mesa) ao lado de qualquer configuração de estilo, como Tipografia > Tamanho ou Conteúdo > Alinhamento.
Defina um valor específico para esse ponto de interrupção (por exemplo, defina o tamanho da fonte como 20px).Este valor só se aplicará quando a largura do navegador estiver dentro do intervalo definido para esse ponto de interrupção personalizado.
Etapa 4: Salvar e visualizar #
Depois de definir seus estilos responsivos para todos os pontos de interrupção necessários, clique em Atualizar para salvar a página.
Visualize a página ao vivo e redimensione a janela do seu navegador para ver seus pontos de interrupção personalizados acionarem os estilos exclusivos que você definiu.
Perguntas frequentes #
Quantos pontos de interrupção personalizados posso adicionar no Elementor?
Master Addons soma até 3 pontos de interrupção personalizados no plano gratuito e pontos de interrupção ilimitados com Master Addons Pro. Cada ponto de interrupção é um tamanho de tela extra de largura máxima em camadas sobre as visualizações de dispositivos integradas do Elementor para layouts totalmente responsivos.
Como adiciono um ponto de interrupção personalizado no Elementor?
Instale a extensão Pontos de interrupção personalizados a partir da extensão Master Addons, abra a nova página Pontos de interrupção no menu Master Addons e insira uma guia Max-Width em pixels (exemplo de 600 p) para celular pequeno Depois de salvar, o novo ponto de interrupção aparece no Modo Responsivo do Elementor pronto para.
Os pontos de interrupção personalizados exigem o Elementor Pro?
Não. Os pontos de interrupção personalizados são a Plugin Master Addons, não é um recurso Elementor Pro. O plugin gratuito de pontos de interrupção personalizados oferece até 3 pontos de interrupção personalizados, e apenas o limite superior requer Master Addons Pro.
Preciso definir uma largura mínima para cada ponto de interrupção?
Não. Você apenas ajusta o Min-Width do próximo ponto de interrupção para que os intervalos nunca se sobreponham. Por exemplo, um ponto de interrupção para celular pequeno de 60px faz com que o Mobile padrão comece em 601px.
Os pontos de interrupção personalizados retardam meu site?
No. Breakpoints apenas adiciona consultas de mídia CSS padrão, que são leves, e os estilos que você define carregam exatamente como os estilos responsivos integrados do Elementor Seguindo geral Melhores práticas de velocidade do elementor mantém a página rápida, independentemente de quantos pontos de interrupção você usa.
Para uma comparação com os pontos de interrupção integrados do Elementor e uma demonstração ao vivo, consulte o Página de plug-in de pontos de interrupção personalizados.
