# Crea tu propio diseño

> Usa el Diseñador de Launchfolio para organizar tu página en filas y secciones, arrastrar tu contenido, añadir animaciones y publicar un diseño.

https://www.launchfolio.live/docs/es/designer · 2026-10-29

El diseño simple pone tus secciones en un orden fijo. El Diseñador te deja organizar la página tú mismo, pieza a pieza.

## Revisa los teléfonos y el encabezado del sitio

En los teléfonos, las secciones se apilan. **Altura mínima en celulares** controla su altura por separado del ajuste de escritorio; con 0 el texto ocupa solo lo que necesita. Los fondos de foto y video siguen teniendo espacio para mostrar la imagen.

Cuando no hay nada seleccionado, abre los ajustes de página para editar **Encabezado del sitio**. Activa **Mostrar el encabezado en los diseños personalizados** para añadir un nombre y enlaces a tus filas. Cambia el nombre de esos enlaces, ocúltalos o cambia su orden.

En una vista previa, **Diseño publicado** muestra tu contenido en borrador con el diseño que ven ahora tus visitantes. **Diseño en borrador** muestra tu diseño en borrador. Pulsa **Publicar este diseño** en el Diseñador para ponerlo en línea.

## Diseño simple o tu propio diseño

|  | Diseño simple | Tu propio diseño |
| --- | --- | --- |
| Dónde | El editor | El Diseñador, en `/your-name/design` |
| Orden | Fijo: perfil, experiencia, educación, tus secciones, videos | El que quieras, en filas de hasta 4 secciones una al lado de otra |
| Guardado | Se guarda solo | Pulsa **Guardar**. Tu sitio publicado solo cambia cuando publicas |
| Contenido | Se escribe aquí | Viene del editor, así que los textos y las fotos están en un solo lugar |

> **Para que lo sepas:** El Diseñador también funciona en teléfonos y tabletas. Consulta [En un teléfono o una tableta](https://www.launchfolio.live/docs/es/designer#phone-or-tablet).

## Crea tu primer diseño

1. **Abre el Diseñador** — En el editor, busca **Diseña tu página** y pulsa **Abrir el Diseñador**. O pulsa **Diseñador pro** en la barra lateral de tu panel.
2. **Empieza con una fila** — Elige la forma de una fila, como una sección o dos mitades, o un diseño inicial ya hecho.
3. **Arrastra tu contenido** — Desde la lista **Contenido**, arrastra tu nombre, tu foto o una sección a una sección de la página.
4. **Cambia su aspecto** — Haz clic en cualquier fila, sección o bloque y cámbialo en **Propiedades**, al otro lado. Una fila define **Espacio entre secciones**, **Espacio arriba y abajo** y **Espacio a los lados**.
5. **Pulsa **Guardar**** — O ⌘/Ctrl + S. Tu sitio publicado no cambia al guardar.

> **Los cambios de diseño no se guardan solos:** Pulsa **Guardar** antes de salir. Si intentas salir con cambios sin guardar, te preguntamos primero.

> **¿Quieres empezar con ventaja?:** Pulsa **Plantillas** en la barra superior para usar el diseño de una plantilla con tu propio contenido y luego cámbialo aquí. Consulta [Usa una plantilla en tu sitio](https://www.launchfolio.live/docs/es/use-a-template).

El botón de menú (tres líneas), arriba a la izquierda, abre la barra lateral de tu panel sobre la página para ir a cualquier lugar. En pantallas anchas, a su lado ves **Panel** › el nombre de tu sitio › **Diseñador pro**. Pulsa **Panel** o el nombre de tu sitio para ir a tu panel, o **Editor sencillo** en la barra lateral para ir al editor. En pantallas más pequeñas, **Volver al contenido** te lleva de vuelta al editor. Consulta [Tu panel](https://www.launchfolio.live/docs/es/your-sites#getting-around).

## En un teléfono o una tableta

En una pantalla de menos de 1024 píxeles de ancho, el Diseñador se adapta a la pantalla. Tu página la ocupa entera y se muestra al tamaño de tu dispositivo.

1. **Abre la lista de contenido** — Toca la flecha del borde de la pantalla. **Contenido** y **Capas** se deslizan sobre la página.
2. **Toca un elemento** — La lista se cierra y las secciones de tu página empiezan a moverse. Toca **Cancelar** arriba si cambias de idea.
3. **Toca una sección** — El elemento aparece en esa sección.
4. **Toca cualquier cosa para cambiarla** — **Propiedades** se abre sola. O toca la flecha del otro borde de la pantalla.

- En pantallas pequeñas no se puede arrastrar. Para mover una sección o un bloque, selecciónalo y usa las flechas de su pequeña barra de herramientas.
- Cuando la barra superior se queda sin espacio, los botones pasan a **Más** (⋯): primero el idioma, luego **Plantillas**, **Historial de versiones**, **Vista previa** y **Guardar**, y después **Deshacer** y **Rehacer**.
- El botón de publicar dice solo **Publicar**. En los teléfonos más pequeños, ese botón y **Volver al contenido** también pasan a **Más**.
- Un punto en **Más** significa que tienes cambios por guardar.

## Qué puedes colocar

| Grupo | Bloques |
| --- | --- |
| Sobre ti | Nombre, Titular, Foto, Sobre ti, Ubicación, Correo y teléfono, Redes sociales, Botón de currículum |
| Secciones | Experiencia, Educación, Videos y medios, y cada sección que añadiste |
| Extras | Formulario de contacto, Botones del pie de página, Línea de derechos de autor, Espacio vacío, Línea divisoria |

Cada contenido se puede colocar una sola vez. Los espacios vacíos y las líneas divisorias se pueden usar todas las veces que quieras.

Un bloque tiene tres pestañas (Espacio vacío, Línea divisoria y Línea de derechos de autor no tienen **Contenido**). **Contenido** cambia lo que dice, en todas partes. **Estilo** y **Animación** solo cambian cómo se ve y se mueve en este diseño.

## Tu pie de página

Todos los diseños terminan con una fila **Pie de página**. Siempre queda debajo de tus demás filas y le das estilo como a cualquier fila. Selecciónala y pulsa **Quitar el pie de página** para quitarla de tu sitio, o **Añadir un pie de página** debajo de tu página para recuperar uno nuevo. El crédito de Launchfolio que hay debajo está bloqueado. Consulta [El pie de página y el crédito de Launchfolio](https://www.launchfolio.live/docs/es/footer-and-credits#designer-footer).

## Dirección del texto y fuentes

Haz clic en el bloque **Nombre**, **Titular** o **Sobre ti** y abre **Estilo**. En **Texto** eliges **Tamaño**, **Grosor**, **Alineación** y **Color del texto**. En **Idiomas** eliges hacia dónde se lee el texto y su fuente para cada alfabeto. Solo cambia este diseño: los textos siguen iguales en **Contenido**.

| En Idiomas | Qué hace |
| --- | --- |
| **Dirección** | **Auto** la saca de la primera letra del texto: el árabe y el hebreo van de derecha a izquierda; lo demás, de izquierda a derecha. Elige **Izquierda a derecha** o **Derecha a izquierda** para imponerla. |
| **Fuente para inglés, español y francés** | La fuente de las letras latinas: **Fuente del sitio (…)** (la fuente habitual de tu sitio, con su nombre entre paréntesis), Geist, Inter, Poppins, Montserrat, Fraunces, Playfair Display, Lora o Caveat. |
| **Fuente para árabe** | La fuente de las letras árabes: **Fuente del sitio (…)**, IBM Plex Sans Arabic, Markazi Text, Readex Pro, Cairo, Tajawal, Noto Kufi Arabic, El Messiri, Amiri o Noto Naskh Arabic. |

> **Consejo:** Cada alfabeto tiene su propia fuente, así que un nombre que mezcla letras árabes e inglesas usa las dos. El texto de un Bloque libre tiene los mismos controles en sus propiedades.

## Anima tu página

Las filas, secciones y bloques pueden aparecer cuando los visitantes llegan a ellos, moverse sin parar, reaccionar cuando un visitante pasa el puntero por encima y moverse mientras la página se desplaza. Cada uno tiene su propia animación, que se guarda con tu diseño.

> **Los visitantes las ven con el complemento Animaciones:** Prueba todas las animaciones en el Diseñador y en **Vista previa**. Los visitantes las ven en tu sitio publicado cuando tu sitio tiene el complemento **Animaciones**, $10 al año, desde la página **Complementos**. Hasta entonces, tu sitio publicado muestra la misma página sin movimiento, la pestaña **Animación** lleva una corona y **Guardar** te lo recuerda. Consulta [Facturación y renovaciones](https://www.launchfolio.live/docs/es/billing-and-renewals#what-you-pay).

1. **Selecciona una fila, sección o bloque** — Abre su pestaña **Animación**.
2. **Elige qué hace** — Cada recuadro repite su efecto sin parar, para que veas la diferencia. Tu página también lo reproduce.
3. **Ajústala** — Cada cambio la vuelve a reproducir en tu página. Pulsa **Reproducir** para ver todo lo que hace: aparece, se sigue moviendo, muestra su aspecto al pasar el puntero y luego se mueve como si la página se desplazara.
4. **Pulsa **Guardar**** — Luego pulsa **Vista previa** (el ojo) para probarla en toda la página. Los visitantes la ven cuando publicas.

| Grupo | Qué hace |
| --- | --- |
| **Entrada** | Cómo aparece cuando los visitantes llegan a él. Sus ajustes están en la tabla siguiente. |
| **Movimiento continuo** | Un movimiento suave y repetido una vez en la página: **Flotar**, **Latir**, **Balancear**, **Girar**, **Respirar** o **Rebotar**, con una **Velocidad** y una **Cantidad** |
| **Al pasar el cursor** | Cuando un visitante lo señala con el ratón: **Elevar**, **Agrandar**, **Inclinar**, **Brillo** o **Aclarar** |
| **Al desplazarse** | Se mueve con la página mientras los visitantes la recorren: **Deslizar**, **Desvanecer**, **Agrandar**, **Girar** o **Desplazar**, con una **Cantidad**. Una sección con fondo de foto o video puede usar **Foto en movimiento**: solo se mueve su fondo, más despacio que la página. |

| En Entrada | Qué hace |
| --- | --- |
| **Efecto** | **Ninguno**, **Aparecer**, **Subir**, **Caer**, **Desde la izquierda**, **Desde la derecha**, **Acercar**, **Alejar**, **Desenfocar**, **Voltear**, **Revelar** o **Inclinar** |
| **Intensidad** | Cuánto se mueve, crece o gira: **Suave**, **Media** o **Fuerte** |
| **Empezar desenfocado** | Empieza borroso y se vuelve nítido mientras se reproduce. Queda muy bien en textos. |
| **Duración** | Cuánto dura, hasta 3 segundos |
| **Espera antes de empezar** | Una pausa cuando ya está en pantalla, hasta 3 segundos |
| **Secciones** | Filas: **Todo junto** o **Uno por uno**: las secciones de la fila aparecen una tras otra, con **Tiempo entre secciones** |
| **Elementos** | Secciones y listas: **Todo junto** o **Uno por uno**: los elementos de una sección, o los trabajos, fotos, tarjetas o enlaces de una lista, aparecen uno tras otro, con **Tiempo entre elementos** |
| **Texto** | Nombre, titular y sobre ti: **Todo junto**, **Palabra por palabra** o **Letra por letra**, con el tiempo entre ellas |
| **Sensación** | **Fluida**, **Suave**, **Con rebote** o **Constante** |
| **Reproducir cada vez** | Se vuelve a reproducir cada vez que vuelve a verse en pantalla. Si está desactivado, se reproduce una sola vez. |

Sin nada seleccionado, **Animaciones** en los ajustes de página actúa sobre toda la página:

| Ajuste | Qué hace |
| --- | --- |
| **Animar toda la página** | **Suave**, **Elegante**, **Divertido**, **Audaz** o **Cinematográfico** da a cada fila, sección y bloque una animación a juego, en lugar de las que tenías. Luego cambia la pieza que quieras. |
| **Quitar todas las animaciones** | Desactiva todas las animaciones de la página. |
| **Reproducir en celulares** | Si está desactivado, los teléfonos muestran tu página sin movimiento. |
| **Reproducir la página** | Reproduce aquí todas las animaciones de la página a la vez. |

- **Deshacer** recupera lo que tenías después de **Animar toda la página** o **Quitar todas las animaciones**.
- Las filas solo tienen entrada. Una fila con **Uno por uno** hace aparecer sus secciones una tras otra; una sección con su propia animación la conserva.
- Una sección con **Uno por uno** hace aparecer sus elementos uno tras otro, y su fondo se queda quieto. Un elemento con su propia animación la conserva.
- **Letra por letra** es para textos cortos. Sobre ti, los textos largos y los textos con enlaces aparecen palabra por palabra, igual que el árabe, cuyas letras van unidas.
- **Al pasar el cursor** solo se ve para visitantes con ratón o trackpad. Las pantallas táctiles lo omiten.
- Una pieza que ya está en pantalla cuando se abre la página empieza donde la colocaste y luego se mueve al desplazarse la página.
- En **Capas**, un destello marca todo lo que tiene una animación.

> **Para que lo sepas:** Los visitantes que activaron la opción de reducir el movimiento en su teléfono o computadora ven todo al instante, sin animación. Si tu propio dispositivo está configurado así, las animaciones tampoco se reproducen en el Diseñador.

**¿Por qué mis animaciones no se mueven en mi sitio publicado?**
Tu sitio necesita el complemento **Animaciones**, $10 al año. Los complementos están disponibles para sitios pagados. Hasta que lo actives, las animaciones solo se reproducen en el Diseñador y en **Vista previa**. Si pagaste por transferencia bancaria, los visitantes las ven en cuanto llega.

**¿Mis otros sitios también tienen animaciones?**
No. Un complemento es para un solo sitio: el que está elegido arriba en tu panel cuando lo añades. Cada sitio que quieras animar necesita el suyo.

## Dale estilo al formulario de contacto

Haz clic en el bloque **Formulario de contacto**. En **Contenido**, cambia su **Título**, su **Línea de introducción** y su **Texto del botón**. Deja una casilla vacía para mantener el texto predeterminado en el idioma de tu sitio.

| En Estilo | Qué puedes cambiar |
| --- | --- |
| **Diseño** | **Alineación** (Sección, Izquierda, Centro o Derecha), **Ancho** (Estrecho, Medio o Completo) y **Redondeo de esquinas** |
| **Título** | **Mostrar el título** y **Tamaño del título** (Pequeño, Normal, Grande o Enorme) |
| **Línea de introducción** | **Mostrar la línea de introducción** y **Tamaño de la introducción** |
| **Campos** | **Nombre y correo** uno al lado del otro o apilados, y **Altura del cuadro de mensaje** (de 3 a 10 líneas) |
| **Botón** | **Estilo** (Relleno o Contorno) y **Ancho** (Ajustado al texto o Ancho completo) |

> **Consejo:** Los textos son los mismos en todos los diseños y en el diseño simple. El estilo pertenece solo a este diseño.

## Historial de versiones

Cada vez que publicas, todo tu sitio se guarda como una versión: tu contenido, tu diseño y qué diseño se mostraba. Pulsa el botón del reloj (**Historial de versiones**) arriba para verlas. La misma lista está en **Historial de versiones**, en la barra lateral de tu panel. Se guardan las 10 más recientes, además de tu primera versión y la que está en línea.

| Acción | Qué hace |
| --- | --- |
| Vista previa | Ver esa versión tal como se publicó. |
| Poner esta versión en línea | Tu sitio vuelve a esa versión: su contenido, su diseño y su disposición. |
| Editar desde aquí | La convierte en tu borrador, contenido y diseño, y la carga en el Diseñador. Tu sitio publicado no cambia. |
| Cambiar nombre | Ponle un nombre que recuerdes. |
| Eliminar | La borra para siempre. La versión en línea no se puede eliminar. |

## Publica un diseño

1. **Pulsa **Publicar este diseño**** — Publica todo tu sitio con este diseño y lo guarda en tu historial de versiones.
2. **Confirma** — Verás **¡Tu diseño está en línea!**

Para volver al diseño simple, abre **Historial de versiones** y pulsa **Usar el diseño sencillo**.

> **Para que lo sepas:** Hasta que tu sitio esté pagado y aprobado, puedes guardar tu diseño pero no publicarlo. **Publicar** muestra una corona (aún sin pagar: abre la página de pago) o un candado (en revisión). Consulta [Pagar para publicar](https://www.launchfolio.live/docs/es/pay-and-review).

## Bloque libre: una sección de forma libre

Un Bloque libre es una sección que añades en el editor. Dentro de él colocas textos, imágenes, botones y líneas donde quieras sobre una cuadrícula.

- Usa **Agregar:** para añadir Texto, Imagen, Botón o Línea.
- Arrastra para mover y tira de las asas para cambiar el tamaño. Mantén pulsada la tecla Shift al cambiar el tamaño para conservar la forma.
- Haz doble clic en un texto para escribir en la página. Las flechas del teclado mueven un poco el elemento seleccionado. La tecla Suprimir lo elimina.
- Usa **Capas** para elegir qué queda delante.

## Las notas doradas

La primera vez que usas el Diseñador, unas notas doradas escritas a mano te señalan para qué sirve cada cosa. Cierra una y no volverá a aparecer en ese dispositivo.