Puntos de interrupción personalizados de Elementor: agregue más tamaños de dispositivo (complemento gratuito)

Custom Breakpoints for Elementor es un complemento gratuito del equipo de Master Addons que agrega los tamaños de sus propios dispositivos al modo responsivo de Elementor. Elementor se detiene en siete vistas de dispositivo. Este complemento agrega puntos de interrupción además de ellos, como un teléfono pequeño de 600 px o un escritorio de 1440 px, cada uno con su propio nombre y ancho de píxel. La versión gratuita incluye 3 puntos de interrupción personalizados y Master Addons Pro los hace ilimitados. Funciona con o sin Master Addons instalados.

Cómo agregar un punto de interrupción personalizado en Elementor

Primero verifique las vistas adicionales de Elementor en Configuración del sitio > Diseño > Puntos de interrupción. Si ninguno de ellos encaja, agregue el suyo propio:

  1. Instalar Puntos de interrupción personalizados para Elementor desde Complementos > Agregar nuevo y activarlo.
  2. Abra Puntos de interrupción en el menú de su panel. Si Master Addons está activo, se encuentra en el menú Master Addons.
  3. Agregue un dispositivo, asígnele un nombre e ingrese su ancho máximo en píxeles, por ejemplo 600 para teléfonos pequeños.
  4. Guardar. El complemento ordena la lista y ajusta los rangos vecinos.
  5. Edite una página con Elementor, elija la nueva vista en modo responsivo y diseñe sus elementos para ella.

Véalo funcionando en el demostración de puntos de interrupción en vivo, o lea nuestra guía para puntos de interrupción personalizados para Elementor para más ejemplos.

Puntos de interrupción de dispositivo personalizados para Elementor

Tamaños de dispositivos personalizados con tus propios nombres

Nombra el dispositivo e ingresa su ancho máximo en píxeles. El complemento ordena cada punto de interrupción por ancho y calcula los rangos para ti, por lo que una vista de Small Mobile de 600 px cubre pantallas de hasta 600 px y la siguiente vista comienza en 601 px. Los puntos de interrupción guardados aparecen en la barra de herramientas responsiva de Elementor junto a las vistas integradas.

  • 3 puntos de interrupción personalizados gratis, ilimitados con Master Addons Pro.
  • Los puntos de interrupción se clasifican automáticamente por ancho, por lo que los rangos nunca se superponen.
  • Un botón de reinicio para volver a los valores predeterminados de Elementor, además de importar y exportar con Pro.

Funciona dentro del modo responsivo de Elementor

Los puntos de interrupción personalizados se comportan como los propios de Elementor. Elija la nueva vista en la barra de herramientas responsiva, luego establezca tamaños de fuente, relleno, anchos de columna y otros valores responsivos que se apliquen solo dentro de ese rango. El complemento se conecta al sistema de puntos de interrupción de Elementor, por lo que las vistas adicionales aparecen en los controles responsivos en Elementor y en los widgets de Master Addons.

  • Elija vistas personalizadas en la misma barra de herramientas que Móvil y Tableta.
  • Establezca valores de tipografía, espaciado y diseño para cada vista.
  • Repare los diseños que se rompen entre dos de los anchos integrados de Elementor.
Puntos de interrupción personalizados en la vista previa del editor Elementor

Puntos de interrupción integrados de Elementor frente a puntos de interrupción personalizados

Elementor free y Pro comparten las mismas siete vistas de dispositivos: Mobile Portrait (767px), Mobile Landscape (880px), Tablet Portrait (1024px), Tablet Landscape (1200px), Laptop (1366px), Desktop y Widescreen (2400px y superiores). Cada ancho es editable, pero no puedes agregar una octava vista.

Puntos de interrupción del elementorComplemento de puntos de interrupción personalizados
PrecioGratisGratis, ilimitado con Master Addons Pro
Vistas de dispositivosHasta 7Elementor's 7 plus 3 personalizado (gratis) o ilimitado (Pro)
NombresFijoTu propio
AnchosEditableEditable
Importación y exportaciónNoCon Pro

Para saber cómo diseñar cada dispositivo una vez establecidos sus puntos de interrupción, lea nuestra guía diseño responsivo con puntos de interrupción Elementor. Para mostrar u ocultar secciones enteras por dispositivo, utilice Condiciones de visualización (Pro).

Visor de plantillas
Facebook
Gorjeo
WhatsApp
Copiar enlace
Compra ahora
Punto de interrupción personalizado
Punto de interrupción personalizado

Preguntas frecuentes sobre puntos de interrupción personalizados

Conozca las consultas más frecuentes que tienen los usuarios sobre puntos de interrupción personalizados y encuentre respuestas en un solo lugar.
¿cuál es un ejemplo del mundo real de necesidad de un punto de interrupción personalizado?

El texto y los botones que se ven bien en 767px pueden parecer estrechos en un teléfono de 360px. Agregue un punto de interrupción de Small Mobile a 400px, luego aumente el tamaño de fuente y el relleno de botones solo para esas pantallas. Todo más amplio mantiene los estilos móviles habituales.

Unos cuantos puntos de interrupción adicionales no supondrán una diferencia notable. Cada uno agrega otro valor de respuesta a cada control, por lo que diez o más pueden hacer que el editor se sienta más pesado. Agregue solo las vistas que realmente diseñará. Cinco o seis en total, incluidos los valores predeterminados, son suficientes para la mayoría de los sitios.

¿estos puntos de interrupción personalizados afectan el CSS y el rendimiento de mi sitio en vivo?

Cada punto de interrupción agrega consultas de medios CSS a la hoja de estilo que genera Elementor. Esa es una pequeña cantidad de CSS, por lo que los visitantes no notarán una diferencia en el tiempo de carga.

Es posible que no necesite uno personalizado. Elementor ya tiene vistas de paisaje móvil (880px) y paisaje de tabletas (1200px) que puede activar en Configuración del sitio > Diseño > Puntos de interrupción. Agregue un punto de interrupción personalizado cuando necesite un ancho que esas vistas no cubran.

Widgets y extensiones de Elementor de tendencia

Cree sitios web sofisticados en menos tiempo.

Master Addons Extensión Glassmorphism para Elementor: tarjetas de vidrio esmerilado con el control Blur Value configurado en 20px

Vidriomorfismo

Inicio Extensión de Glassmorphism Elementor gratuita: Efecto del vidrio esmerilado en un solo cambio El Glassmorphism es el esmerilado...
Ver detalles
Extensión Master Addons Container Extras para Elementor: contenedor con un límite de ancho máximo de 1400px, con controles de ancho máximo, alto máximo, ancho mínimo y alto mínimo

Extras de contenedores

Inicio Elementor Container Controles de ancho y alto máximo Container Extras es un maestro gratuito...
Ver detalles
Extensión de patrones de complementos maestros para Elementor: héroe con el estilo Purple Gradient Grid Left, tres estilos de patrones más y el panel Habilitar patrón

Patrones

Inicio 70+ Patrones de fondo de Elementor gratuitos Patrones es una extensión de complementos maestros gratuita que agrega...
Ver detalles
Extensión de duplicador de páginas/publicaciones de complementos maestros para Elementor: enlace de fila de duplicador MA en la lista de páginas de WordPress que crea una página de inicio - borrador [duplicado #128]

Duplicador de publicaciones/páginas

Inicio Duplicar páginas y publicaciones de Elementor en un clic Publicación/Duplicador de páginas es un maestro gratuito...
Ver detalles
Extensión de la barra de progreso de lectura de complementos maestros para Elementor: barra azul llena al 42% en la parte superior de una página de política de privacidad, con configuraciones de habilitar, colocar, altura y llenar color

Barra de progreso de lectura

Inicio Agregue una barra de progreso de lectura en WordPress (Elementor) La barra de progreso de lectura es gratuita...
Ver detalles