Fondo Plantillas CSS

El contenido del pie de página requiere más que una ubicación correcta cuando varios grupos de enlaces, contactos y avisos legales comparten un espacio limitado. Una plantilla orientada a CSS ofrece un sistema visual para columnas, espacios, contraste, alineación y equilibrio de la sección.

Otro Texto y botón Plantillas CSS

Plantillas CSS inferiores creativas para filas de cuadrícula, franjas de contacto y pies de página

Las plantillas CSS inferiores incluyen las reglas visuales para la última sección de una página, abarcando espaciados internos y colores. En esta colección, esa sección adopta diversas formas: desde una fila de celdas de cuadrícula con texto y botones hasta un bloque de texto dividido o una franja de contacto. Cuanto más se acerquen los valores predeterminados de una plantilla a tu contenido, menos reglas tendrás que reescribir después.

Columnas que se apilan en teléfonos móviles

Las pantallas más anchas pueden admitir varios grupos paralelos, mientras que los diseños más estrechos pueden apilarlos en una secuencia legible. Las reglas de Grid o Flexbox aplican este cambio en puntos de ruptura definidos, de modo que cuatro columnas de enlaces en un portátil se transformen en una sola columna en un teléfono.

La documentación de Nicepage sobre el Grid Element detalla los controles para columnas, filas y espacios dentro de un bloque. En las plantillas creadas con un Grid Repeater, aplicar estilo a una celda actualiza el resto, y la cantidad de columnas puede variar según los diferentes modos adaptativos.

Cada disposición inicial se ajusta a un tipo diferente de contenido inferior:

  • Varias columnas contiguas son ideales para un pie de página con muchos enlaces, siempre que el espaciado mantenga los grupos separados.
  • Un diseño apilado se adapta a un mensaje de cierre breve centrado sobre un solo botón y apenas cambia en un teléfono.
  • Una fila única y compacta encaja con una franja estrecha con aviso de copyright y algunos iconos, siempre que el texto sea corto.

Espaciado y contraste donde termina el contenido

Las plantillas CSS inferiores también van desde estilos amplios hasta configuraciones muy compactas. Un relleno generoso alrededor de un área inferior despejada hace que unas pocas líneas de datos de contacto parezcan intencionadas. En columnas de enlaces densas, los espacios más estrechos evitan que la franja se extienda en exceso hacia abajo.

El contraste con el contenido superior también varía. Una franja oscura delimita la parte inferior de forma marcada, mientras que un borde fino sobre el fondo de la página genera una transición más suave. Ese borde suave es la opción más segura tras una sección oscura, ya que una franja oscura justo debajo se fundiría en un solo bloque pesado.

Texto destacado, letra pequeña

Una plantilla puede destacar el nombre de marca o un encabezado de contacto con mayor tamaño y contraste, dejando los enlaces de políticas más pequeños y claros. Otra puede mantener todas las líneas del mismo tamaño y depender únicamente de la distribución. Si tu área inferior contiene un dato prioritario para los visitantes, como un número de teléfono, la primera opción estará más cerca del acabado final.

Los Nicepage Theme Colors aplican una combinación de colores uniforme a todo el proyecto, y al cambiar un ajuste predefinido se actualiza todo lo que los utilice. Una franja configurada con un color personalizado lo conservará tras el cambio, dando la impresión de pertenecer a otro sitio. Una plantilla cuya parte inferior ya utilice Theme Colors se adaptará a tu paleta sin trabajo adicional.