Widget de alternancia de contenido Elementor para cambiar de sección (Pro)
Toggle Content es un conmutador de contenido para Elementor, también llamado conmutación de contenido. Es un widget Pro de Master Addons que pone un botón de palanca arriba (o debajo) de un bloque de contenido. Los visitantes hacen clic en una etiqueta y el contenido debajo de ella cambia, la forma en que un cambio mensual facturado y facturado cambia un conjunto de tarjetas de precios. Cada opción puede contener el texto que escriba o una sección de elementos guardada, una página o una plantilla de widget, y puede agregar tantas opciones como desee. Un indicador de color se desliza detrás de la etiqueta activa. El widget cambia entre conjuntos de contenido y no expande ni contrae una lista, por lo que para preguntas frecuentes plegables Acordeón avanzado.
Cómo agregar un cambio de contenido en Elementor
Alternar contenido necesita Elementor y un activo Complementos maestros Pro licencia. Si una opción debe mostrar un diseño completo, primero guárdela como plantilla.
- Guarde las secciones entre las que desea cambiar (por ejemplo, Precios mensuales y Precios anuales) como plantillas de Elementor.
- Edite su página con Elementor, busque en el panel de widgets Alternar contenido y arrástrelo a su lugar.
- En Elementos, cambie el nombre de Etiqueta uno y Etiqueta dos y agregue más elementos si los necesita.
- Para cada elemento, establezca Tipo en Contenido y escriba el texto, o configúrelo en Plantilla y elija la sección, página o widget guardado.
- En Alternar configuración, elija el índice activo, coloque el interruptor Antes o Después del contenido y configure la velocidad del indicador.
- Diseñe el alternador, el indicador y las etiquetas, configure Stack On para dispositivos móviles, luego obtenga una vista previa y haga clic en cada etiqueta.
Cada entorno está cubierto en el Alternar configuración del widget de contenido guía.
Botón de alternancia o alternancia de contenido: ¿Cuál necesitas?
La gente usa el "botón de alternancia" para dos cosas diferentes en Elementor. Uno es un título que abre y cierra el texto debajo de él, como en una pregunta frecuente. El propio widget de palanca de Elementor hizo ese trabajo, y Elementor ahora lo oculta a favor del acordeón. El otro es un botón que cambia un bloque de contenido por otro, como los precios mensuales por los anuales. Ese segundo tipo es un conmutador de contenido, y es lo que hace el contenido de alternancia.
- Para abrir y cerrar respuestas en una lista, use acordeón o Acordeón avanzado.
- Para cambiar entre dos o más versiones de una sección, utilice el contenido de alternancia.
Alternar contenido vs acordeón vs pestañas en Elementor
Los tres ahorran espacio, pero resuelven problemas diferentes. El antiguo widget de alternancia de Elementor es una lista plegable y Elementor ahora lo oculta del panel en favor de Accordion. Ni Elementor ni Elementor Pro tienen un conmutador que intercambia un conjunto de contenido por otro, que es el trabajo que realiza Toggle Content.
| cuerda | Lo que ven los visitantes | Mejor para | Dónde conseguirlo |
|---|---|---|---|
| Alternar contenido | Un cambio con etiquetas. Un conjunto de contenido se muestra a la vez. | Precios mensuales y anuales, planes personales y de negocios, dos versiones de una sección | Complementos maestros Pro |
| Acordeón | Una pila de títulos que se expanden y colapsan | Preguntas frecuentes y largas listas de respuestas breves | Elementor Accordion (gratis) o Acordeón avanzado (gratis) |
| Pestañas | Una fila de títulos de pestañas sobre un área de contenido | Varias secciones de peso similar, como Características, Especificaciones y Reseñas | Pestañas Elementor (gratis) o Pestañas avanzadas (gratis) |
Si los visitantes necesitan ver varias respuestas a la vez, utilice un acordeón. Si hay muchas secciones, las pestañas son más claras. Cuando la elección es entre dos o tres versiones de lo mismo, un cambio de contenido mantiene el diseño estable y hace que la elección sea obvia. También combina bien con el Tabla de precios Widget.
Un conmutador de contenido para texto o plantillas guardadas
Cada artículo en el Elementos el repetidor es una opción en el interruptor. Dale un Etiqueta y un opcional Icono (antes o después de la etiqueta, con Icon Spacing). Luego establezca Tipo al Contenido de un editor de texto con etiquetas dinámicas y multimedia, o a Plantilla y elija una Sección, Página o Widget guardado de su biblioteca Elementor.
- Cree las tablas de precios mensuales y anuales en dos secciones guardadas y luego apunte una opción a cada una.
- Un formulario, una galería o cualquier otro widget pueden aparecer en una opción una vez que se guarda como plantilla.
- Cada opción tiene su propio color de etiqueta, color de etiqueta activo y color indicador en su subpestaña Estilo.
Diseñe el alternador, el indicador y las etiquetas
El Alternador la sección estiliza la pista de cambio: estilo (redondo o cuadrado), color de fondo, radio de borde, alineación, zoom para escalarla, ancho (%), borde, sombra de caja, relleno y margen. Indicador diseña el resaltado deslizante con su propio fondo, alto, ancho, radio del borde, sombra de caja y acolchado. Etiquetas establece tipografía, una transición, espacio entre y colores para los estados predeterminado, flotante y activo.
- un Contenido la sección estiliza el panel a continuación con tipografía, relleno, margen, borde, color y fondo.
- La velocidad del indicador establece cuánto tiempo tarda la diapositiva, 0,3 segundos de forma predeterminada.
- El propio panel de contenido cambia inmediatamente. Sólo se desliza el indicador.
Opción predeterminada, posición y diseño móvil
Índice activo elige la opción que muestra cuándo se carga la página, 1 para la primera. Posición pone el interruptor Antes o Después del contenido. En pantallas pequeñas, Apilar (Todos, Tableta y Móvil, o Móvil) convierte la fila de etiquetas en una lista vertical, con controles separados de Alineación en línea y Alineación apilada.
- Con dos opciones, al hacer clic en la etiqueta activa se pasa a la otra, por lo que funciona como un interruptor de encendido y apagado.
- Con tres o más, al hacer clic en la etiqueta activa se pasa a la siguiente opción.
- La página no recuerda la elección, por lo que cada visita comienza con la opción Índice activo.
Construya un cambio de precios mensual y anual
Un interruptor de facturación es el uso más común de este widget. Construye los precios mensuales y los precios anuales como dos secciones separadas, y el botón muestra uno de ellos a la vez.
- Construya sus planes mensuales en una página de borrador en blanco. los Tabla de precios El widget funciona bien aquí, con un widget por plan.
- Haga clic en la flecha junto a Publicar, elija Guardar como plantilla y asígnele el nombre Precios mensuales. Esto crea una plantilla de página.
- Cambie los precios y el texto de facturación, luego vuelva a guardar como precios anuales.
- Agregue contenido de alternancia donde deberían aparecer los planes. Cambie el nombre de los dos artículos mensualmente y anualmente. Para cada uno, establezca Tipo Para la plantilla, elija la página en Tipo de plantilla y elige la plantilla correspondiente.
- Conjunto Índice activo Para la opción que los visitantes deben ver primero, luego obtener una vista previa de la página y hacer clic en ambas etiquetas.
La lista de sección en el tipo de plantilla solo muestra las plantillas guardadas con el tipo de sección. Un contenedor guardado por sí solo se almacena como una plantilla de contenedor y no aparece allí, por lo que una plantilla de página es la opción más segura.
Si prefiere escribir los planes directamente en el widget, deje escribir el contenido y usar el editor de texto, como en la captura de pantalla anterior.
Alternar contenido de un vistazo
La versión corta de lo que hace y no hace el widget.
| Característica | Alternar contenido |
|---|---|
| Opciones | dos o más. Agregue elementos en el repetidor de elementos. |
| Contenido en cada opción | Texto del editor, o una sección guardada, página o plantilla de widget |
| Estilo de cambio | Redondo o Cuadrado |
| Posición del interruptor | Antes o después del contenido |
| Opción predeterminada | Establecer con índice activo |
| Iconos de etiqueta | Opcional, antes o después de la etiqueta |
| Disposición móvil | Las etiquetas pueden apilarse en móviles, tabletas y móviles, o en todas las pantallas |
| Recuerda la elección del visitante | prohibido . Cada visita comienza en la opción predeterminada. |
| Abrir una opción desde un enlace | prohibido |
| Necesidades | Complementos de Elementor y Maestros Pro |
Ejemplos de alternancia de contenido
Cada demostración a continuación es un widget de contenido de alternancia que puede abrir y hacer clic. El precio es el trabajo habitual para un conmutador de contenido, y las demostraciones muestran algunas otras.
- Tarjetas de precios de cambio de facturación: Precios mensuales y anuales en tres tarjetas de plan.
- Tabla de especificaciones del interruptor de unidad: Mediciones métricas e imperiales en una tabla de especificaciones.
- Tabla comparativa del interruptor de datos: Dos conjuntos de datos, operaciones propias y cadena de suministro, en la misma tabla.
- Panel de funciones de Audience Switch: Un mensaje para los equipos y otro para las personas que aprenden por su cuenta.
- Métricas de cambio de cuarto Bento: Resultados para un trimestre o el siguiente.
- Cronología del paso de ruta del pedido: Los pasos para un artículo hecho a pedido o uno que esté en stock.
- Tarjeta superpuesta de interruptor de proyecto: Proyectos residenciales y cívicos.
- Lista de menús del interruptor de servicio: un menú de almuerzo y un menú de cena.
- Alternar contenido redondeado: un cambio redondeado entre un solo plan y un plan ilimitado.
- Alternar contenido con precios: Facturado mensualmente y facturado planes anuales.
Preguntas frecuentes para alternar contenido
¿alternar contenido es gratuito?
No. Alternar contenido es un widget profesional y necesita un Complementos maestros Pro licencia. El complemento gratuito tiene Acordeón avanzado y Pestañas avanzadas, que cubren listas plegables y secciones con pestañas.
¿puedo usar mis plantillas de Elementor guardadas dentro de un interruptor?
Sí. En un elemento, establezca Tipo en Plantilla, elija Sección, Página o Widget en Tipo de plantilla y luego elija la plantilla guardada. Esa opción muestra la plantilla completa cuando su etiqueta está activa.
¿Es lo mismo un conmutador de contenido que un conmutador de contenido?
Sí. Conmutador de contenido y alternancia de contenido son dos nombres para el mismo tipo de widget: un conmutador que muestra un bloque de contenido y oculta los demás. Algunos complementos llaman a su conmutador de contenido. Los complementos maestros lo llaman alternar contenido.
¿Cómo creo un botón de alternancia en Elementor?
Para un botón que cambia el contenido, agregue contenido de alternancia, nombre los elementos (por ejemplo, mensualmente y anualmente) y proporcione cada uno de texto o una plantilla guardada. Para un título que abre y cierra una respuesta, use el widget de acordeón.
¿A dónde fue el widget de palanca de elementos?
Elementor ahora oculta su antiguo widget de palanca desde el panel del widget cuando los elementos anidados están activos y ofrece acordeón para listas plegables. El antiguo widget era una lista plegable y nunca cambió entre conjuntos de contenido, que es el trabajo de alternancia de trabajo.
¿en qué se diferencia un cambio de contenido de un acordeón o de pestañas?
Un acordeón expande y contrae elementos en una lista, y las pestañas muestran una fila de títulos en un área de contenido. Un conmutador de contenido, también llamado conmutador de contenido, cambia un conjunto de contenido completo por otro, lo que se adapta a opciones como precios mensuales o anuales. El propio widget Toggle de Elementor es realmente una lista plegable y ahora está oculto a favor del acordeón.
¿cómo se comporta en el móvil?
Las etiquetas se encuentran en fila de forma predeterminada. Configure Stack On en Mobile, Tablet & Mobile o All para apilarlas verticalmente y use Stacked Align para alinearlas. El contenido de la plantilla sigue su propia configuración responsiva.
¿Puedo tener más de dos opciones de alternancia?
Sí. Haga clic en Agregar elemento en el repetidor Elementos para agregar más. Con tres o más opciones, al hacer clic en la etiqueta activa se pasa a la siguiente y al hacer clic en cualquier otra etiqueta se salta directamente a ella. Para muchas secciones, las pestañas suelen ser más fáciles de escanear.
¿Se puede abrir una opción de alternancia de forma predeterminada?
Una opción siempre se muestra. Establezca el índice activo en la configuración de alternar para elegir cuál: 1 para el primer elemento, 2 para el segundo, y así sucesivamente.
¿Pueden los motores de búsqueda leer la opción oculta?
Sí. Cada opción está en la página HTML y solo la activa está visible, por lo que los motores de búsqueda pueden leerlas todas. Haga que la versión que más importa sea la opción predeterminada, porque esa es la que los visitantes ven primero.
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
