Widget Elementor Off-Canvas para paneles y menús deslizables (Pro)
El contenido fuera del lienzo es un widget Master Addons Pro que coloca un botón en la página y abre un panel cuando un visitante hace clic en él. El panel muestra una plantilla de Elementor guardada, por lo que puedes colocar un menú, un formulario de contacto, filtros o una promoción dentro de él y reutilizar la misma plantilla en otras páginas. Elija dónde aparece el panel, cómo se anima y cómo se ve el botón. Los visitantes lo cierran con el icono de cerrar, haciendo clic en la superposición o presionando Esc.
Cómo agregar un panel fuera del lienzo en Elementor
Necesitas Elementor y un activo Complementos maestros Pro licencia.
- Ir a Plantillas, Plantillas guardadas, cree una plantilla, cree el contenido del panel y publíquelo.
- Edita la página, busca Contenido fuera del lienzo y arrástralo donde debería aparecer el botón.
- En Seleccione Plantilla, elige la plantilla que guardaste.
- Elige un Posición y establezca el ancho o el alto.
- Elija una animación de entrada y una duración.
- Establezca el título o icono del botón, luego escriba el botón, el encabezado y el contenedor en la pestaña Estilo.
Ver el Configuración de contenido fuera del lienzo guía para cada opción.
Posición, tamaño y animación del panel
Posición ofrece derecha, izquierda, superior, inferior, media y relativa. Los paneles izquierdo, derecho y medio obtienen un ancho en px, % o vw, y los paneles superior, inferior y medio obtienen una altura en px, % o vh, cada uno ajustable por dispositivo. Animación de entrada es Fade, Slide o Grow, y solo Fade funciona con Relative. Los paneles izquierdo, derecho y superior también tienen un Tipo de entrada de Cobertura o Empuje. Establecer el Duración de la animación en segundos, y enciende Abierto por defecto si el panel comenzara a abrirse.
- Un panel izquierdo o derecho con el menú de su sitio para pantallas más pequeñas.
- Un panel superior para un breve anuncio o formulario de búsqueda.
- Un panel central como modal simple para un formulario de registro.
Botón de activación, encabezado y diseño de contenedores
El botón de activación puede mostrar un título, un ícono o ambos, con la configuración de distancia y alineación del ícono. Estilee su color, color de fondo y color de borde para normal y flotante, además de sombra de caja, tipografía, tamaño SVG, relleno, tipo de borde y radio de borde. Dentro del panel, el Encabezado la sección diseña el icono de cierre y el título del encabezado opcional, y el encabezado inverso intercambia sus lugares. El Contenedor la sección establece el fondo del panel, el borde, el acolchado, el color de la superposición y el color y ancho de la barra de desplazamiento.
- Un botón de hamburguesa solo con iconos en un encabezado.
- Un botón de texto “Contáctenos” que abre un formulario.
- Un color de superposición de marca que atenúa la página detrás del panel.
Elementor Pro fuera del lienzo frente a complementos maestros Contenido fuera del lienzo
Un menú fuera del lienzo es el uso más común. Este widget no crea el menú en sí, por lo que primero coloca un widget de menú en una plantilla. Si solo necesita el menú, los complementos maestros Menú de navegación widget también tiene un diseño de hamburguesa con un tipo fuera de lienzo en Pro, que omite el paso de plantilla. Utilice contenido fuera de lienzo cuando el panel contenga más de un menú, como un logotipo, datos de contacto y enlaces sociales.
| Característica | Elementor Pro fuera del lienzo | Addons maestros Contenido fuera del lienzo |
|---|---|---|
| Precio | Necesita Elementor Pro | Necesita complementos maestros Pro |
| Contenido del panel | Construido dentro del widget en modo de edición | Una plantilla de Elementor guardada que puedes reutilizar |
| Cómo se abre | Cualquier botón o enlace que utilice la acción Off-Canvas | El propio botón de activación del widget |
| Posición | Inicio, Centro o Fin Horizontal y vertical | Derecha, Izquierda, Arriba, Abajo, Medio o Relativo |
| Animación | Animaciones de entrada y salida | Desvanecerse, deslizarse o crecer, con cubierta o empujar |
| Clausura | Superposición y Esc, cada uno se puede desactivar; puede bloquear el desplazamiento de la página | Cierre el icono, haga clic en superposición o Esc |
| Cabecera incorporada | No | Título del encabezado e icono de cierre |
| Abierto de forma predeterminada | No es una configuración de widget | Sí |
Elementor Pro gana cuando cualquier enlace de la página debe abrir el panel o cuando desea salir de las animaciones. Los complementos maestros se ajustan cuando una plantilla debe aparecer detrás de un botón listo para usar en muchas páginas. Para ver un panel de búsqueda, consulte también Buscar widget.
Cómo crear un menú fuera del lienzo en Elementor
Un menú fuera del lienzo es el uso más común. El widget no crea el menú en sí, por lo que primero coloca un widget de menú en una plantilla.
- Cree una plantilla guardada y agregue un widget de menú, como los complementos maestros gratuitos Menú de navegación establecido en un diseño vertical.
- Publica la plantilla.
- En su encabezado, agregue contenido fuera del lienzo y seleccione esa plantilla.
- Establezca la posición a izquierda o derecha, el ancho a alrededor de 320 px y la animación de entrada para deslizar.
- Desactiva Mostrar título, activa Mostrar icono y elige un icono de barras para que el botón parezca una hamburguesa.
- Utilice la visibilidad responsiva de Elementor para mostrar este botón solo en tabletas y dispositivos móviles si el encabezado del escritorio mantiene su menú normal.
Preguntas frecuentes sobre contenido fuera del lienzo
¿el widget de contenido fuera del lienzo es gratuito?
No. El contenido fuera del lienzo es parte de Complementos maestros Pro. El complemento gratuito no lo incluye.
¿cómo agrego contenido al panel fuera del lienzo?
Primero cree el contenido como una plantilla de Elementor guardada, como un menú, formulario o promoción. Luego elija esa plantilla en el menú desplegable Seleccionar plantilla del widget. Puede reutilizar una plantilla en varios paneles.
¿puedo crear un menú fuera del lienzo con él?
Sí. Coloque un widget de menú como los complementos maestros Menú de navegación en una plantilla guardada, selecciónela en Contenido fuera del lienzo, establezca la Posición en Izquierda o Derecha y use un ícono de barras para el botón. Solo para un menú, el diseño de la hamburguesa del menú de navegación en Pro tiene su propio tipo fuera del lienzo.
¿El contenido del panel ralentiza mi página?
La plantilla se representa en la página cuando se carga y luego se oculta hasta que se hace clic en el botón. Un panel con algunos widgets agrega poco peso, pero los controles deslizantes o videos pesados dentro de él se cargan con la página, así que mantenga las plantillas del panel livianas.
Widgets y extensiones de Elementor de tendencia
Cree sitios web sofisticados en menos tiempo.
Vidriomorfismo
Extras de contenedores
Patrones
![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]](https://d1asvmc6qcowgk.cloudfront.net/wp-content/uploads/2026/09/15102930/post-page-duplicator-768x403.webp)
Duplicador de publicaciones/páginas
