Al diseñar las páginas de tu tienda en GemPages, conseguir el espaciado adecuado alrededor de cada elemento marca la diferencia entre una página con un aspecto cuidado y una que da la sensación de estar desordenada. Relleno: Es uno de los controles de espaciado más importantes, ya que define el espacio interior entre el contenido de un elemento y su borde en los lados superior, derecho, inferior e izquierdo.
Para que la edición del relleno sea más rápida y flexible, GemPages proporciona una Icono de bloqueo/desbloqueo Esto te permite elegir entre ajustar los cuatro lados a la vez o cada lado de forma independiente. Esta guía te explicará paso a paso cómo usarlo.
¿Qué es el relleno en GemPages?
Relleno: es el espaciado interno de un elemento. Controla cuánto espacio libre hay entre el contenido (texto, imagen, botón, etc.) y los bordes del contenedor que lo contiene.
En GemPages, cada elemento tiene cuatro valores de relleno que puedes ajustar:
- arriba: espacio encima del contenido
- Derecha: espacio a la derecha del contenido
- Inferior: espacio debajo del contenido
- Izquierda: espacio a la izquierda del contenido
Ajustar correctamente el relleno ayuda a crear diseños equilibrados, mejorar la legibilidad y garantizar que el diseño se vea genial tanto en ordenadores de escritorio como en dispositivos móviles.
Dónde encontrar la configuración de relleno
Para acceder a los controles de relleno de cualquier elemento en GemPages:
- Abra su página en el Editor de GemPages.
- Haz clic en el elemento que deseas editar (por ejemplo, un título, una imagen, un botón o una sección).
- En la barra lateral derecha, desplácese hacia abajo hasta el Espaciado .
Verás cuatro cuadros de entrada que representan Arriba, Derecha, Abajo e Izquierda, con un pequeño icono de candado en el centro.
![]()
Uso del icono de bloqueo/desbloqueo para editar el relleno
El icono del candado en el centro de los controles de relleno es la clave para una edición flexible. Tiene dos estados:
Modo bloqueado: Edita los 4 lados a la vez.
Cuando el icono se muestra como cerradoLos cuatro valores de relleno están vinculados entre sí. Esto significa que, cada vez que cambie un valor, los otros tres se actualizarán automáticamente para coincidir.
Cuándo usar el modo bloqueado:
- ¿Quieres espaciado uniforme en todos los lados de un elemento.
- Estás aplicando un relleno uniforme a botones, tarjetas o secciones donde la simetría es importante.
- Quieres ahorrar tiempo sin tener que ajustar cada lado manualmente.
Cómo usarlo:
- Asegúrese de que el icono del candado esté en el cerrado/bloqueado estado.
- Haga clic en cualquiera de los cuatro cuadros de entrada (Superior, Derecha, Inferior o Izquierda).
- Introduzca el valor deseado (por ejemplo, 20px).
- Los cuatro lados se actualizarán instantáneamente al mismo valor.
Modo desbloqueado: Edita cada lado individualmente.
Cuando haces clic en el icono del candado, cambia a desbloqueado Ahora, cada uno de los cuatro valores de relleno se vuelve independiente y se puede establecer un número diferente para cada lado.
Cuándo usar el modo desbloqueado:
- Necesita espaciado asimétrico, por ejemplo, más relleno en la parte superior que en la inferior.
- Estás ajustando una sección principal, un banner o un diseño especial.
- Quieres alinear un elemento con el contenido circundante que no sigue un espaciado uniforme.
Cómo usarlo:
- Haz clic en el icono del candado para cambiarlo a desbloqueado estado.
- Haz clic en el cuadro de texto del lado que deseas modificar (Superior, Derecho, Inferior o Izquierdo).
- Introduzca el valor que necesita para ese lado específico.
- Solo cambiará el lado que editaste; los otros tres permanecerán intactos.
Comparación rápida: Bloqueado vs. Desbloqueado
| Moda | Comportamiento | Ideal Para |
| Bloqueado | Al editar un lado, se actualizan los cuatro lados. | Espaciado uniforme y simétrico |
| Desbloqueado | Cada lado se puede editar de forma independiente. | Espaciado asimétrico personalizado |
Consejos para editar el relleno de forma eficaz
Para obtener los mejores resultados al trabajar con relleno en GemPages, tenga en cuenta estos consejos:
- Iniciar en modo bloqueado Para obtener una base limpia, cambie a Desbloqueado si necesita ajustar con precisión lados específicos.
- Comprobar capacidad de respuesta — Cambia entre las vistas de escritorio, tableta y móvil en el editor para asegurarte de que el relleno se vea bien en todos los tamaños de pantalla.
- Utilice valores consistentes Utilice elementos similares (como todos los encabezados de sección o las fichas de producto) para lograr un diseño más profesional y coherente.
- Evite el exceso de relleno. — Demasiado espacio vacío puede hacer que el contenido importante quede oculto y perjudicar la experiencia del usuario.
- Combinar relleno con margen Con detenimiento: el relleno controla el espacio interior, mientras que el margen controla el espacio exterior. Utilice ambos para lograr un control preciso del diseño.
Preguntas frecuentes
1. ¿Puedo establecer diferentes valores de relleno para escritorio y móvil?
Sí. GemPages permite configurar el relleno adaptable para cada tipo de dispositivo. Cambia la vista del dispositivo en la barra de herramientas del editor (Escritorio, Tableta, Móvil) y ajusta el relleno por separado para cada uno.
2. ¿Qué unidades puedo usar para el acolchado?
GemPages normalmente admite px (píxeles) para valores de relleno. Los píxeles le brindan un control preciso sobre el espaciado en cada pantalla.


gracias por tus comentarios