> ## Documentation Index
> Fetch the complete documentation index at: https://help.chateea.com/docs/llms.txt
> Use this file to discover all available pages before exploring further.

# Barra lateral del creador de embudos y sitios web

> Conoce las pestañas General, Estilos y Animaciones y cómo funcionan los paneles plegables del editor.

La barra lateral derecha del creador de embudos y sitios web es donde configuras cada elemento de tu página. Está organizada en tres pestañas (**General**, **Estilos** y **Animaciones**) y agrupa los ajustes en paneles plegables, para que encuentres rápido lo que buscas y veas solo lo que necesitas.

## Ventajas del diseño actual

* **Acceso rápido:** contenido, estilos y animaciones tienen cada uno su pestaña.
* **Espacio de trabajo limpio:** los paneles plegables agrupan ajustes relacionados.
* **Recuerda tus preferencias:** la barra conserva la última pestaña y el estado de los paneles durante tu sesión.
* **Interfaz más ligera:** espaciado, tipografía e íconos más claros y uniformes.

## Las tres pestañas

### General

Aquí ajustas el contenido y el comportamiento del elemento:

* **Nombre del elemento:** renombra la capa para organizarte mejor (por ejemplo, cambiar "Titular" por "Título principal").
* **Opciones del elemento:** varían según el tipo. Textos de titulares, URL de botones y enlaces, texto alternativo de imágenes o etiquetas de campos de formulario.
* **Acciones del elemento:** qué pasa al hacer clic, como ir a una URL, enviar un formulario o abrir una vista ampliada.
* **Tipografía:** fuente, tamaño, grosor, opacidad, interlineado, espaciado entre letras, mayúsculas o minúsculas, e incluso rotación o inclinación.
* **Colores:** fondo, texto, enlaces e íconos, con selector de color o código hexadecimal.

### Estilos

Aquí defines el diseño y la apariencia en todos los tamaños de pantalla:

* **Margen** (espacio exterior) y **relleno** (espacio interior).
* **Borde:** grosor, estilo (sólido, discontinuo o punteado), radio de las esquinas y color.
* **Alineación:** del texto (izquierda, centro, derecha, justificado) o del objeto.
* **Visibilidad:** muestra u oculta el elemento por separado en escritorio, tablet y móvil.
* **Sombra de texto:** desplazamiento horizontal y vertical, desenfoque y color.
* **Clase personalizada y selector CSS:** para identificar el elemento si luego agregas estilos o código propios.

### Animaciones

Aquí das movimiento a tus elementos:

* **Animación de entrada:** efectos como desvanecer, deslizar (arriba, abajo, izquierda, derecha), rebotar y zoom cuando el elemento aparece al hacer scroll. Puedes ajustar dirección y velocidad (suave, media o intensa).
* **Bucle infinito:** movimientos continuos como brillo, balanceo o rebote constante.
* **Borrar:** devuelve todas las animaciones a "Ninguna".

> [!NOTE]
>
> Cada tipo de elemento tiene sus propios paneles. Por ejemplo, las imágenes incluyen opciones de recorte y proporción, los botones tienen estados al pasar el cursor y los formularios muestran reglas de validación. Las opciones exactas dependen del elemento seleccionado.

## Paneles plegables

Dentro de cada pestaña, los ajustes se agrupan en paneles que puedes abrir o cerrar:

* Abre solo los que estés usando.
* Deja plegados los ajustes avanzados o que usas poco.
* Los paneles mantienen su estado durante toda la sesión de edición.

## Memoria de pestañas y paneles

| Comportamiento | Qué pasa |
| - | - |
| **Memoria de pestaña** | Al cambiar de elemento, se mantiene seleccionada la última pestaña que usaste |
| **Memoria de paneles** | Los paneles abiertos o cerrados conservan su estado al pasar de un elemento a otro |
| **Elemento nuevo** | Al agregar un elemento, todos sus paneles se abren para que accedas rápido a todo |

## Preguntas frecuentes

> **¿Este diseño cambia mis embudos o sitios publicados?**
>
> No. Solo cambia la interfaz del editor. Tus diseños publicados quedan igual.

> **¿Se pierden los ajustes que ya tenía en mis elementos?**
>
> No. Solo cambió la organización de la barra lateral; la configuración de tus elementos se mantiene.

> **¿Afecta al rendimiento del editor?**
>
> Sí, para bien. La nueva organización está optimizada para navegar y hacer ajustes más rápido.

> **¿Hay controles de diseño nuevos?**
>
> Este cambio se centra en la organización y la experiencia de uso. Los controles son los mismos, ahora mejor agrupados.

## Artículos relacionados

> **[Animaciones de texto, imágenes y botones](https://help.chateea.com/docs/sitios/animaciones-de-texto-imagenes-y-botones.md)**
>
> Todo sobre la pestaña Animaciones.

> **[Sombras en elementos](https://help.chateea.com/docs/sitios/sombras-en-elementos.md)**
>
> Agrega sombras de caja y de texto.

> **[Menú de navegación y mega menú](https://help.chateea.com/docs/sitios/menu-de-navegacion-y-mega-menu.md)**
>
> Crea menús amplios y organizados.

> **[Ventana emergente de intención de salida](https://help.chateea.com/docs/sitios/ventana-emergente-de-salida.md)**
>
> Capta visitantes antes de que se vayan.


This documentation is built and hosted on [Mintlify](https://mintlify.com), a developer documentation platform.