Nota: Si bien hemos traducido las guías más populares al español, algunas guías están disponibles solamente en inglés.

Familia de plantillas Bedford

La versátil familia de plantillas Bedford (Anya, Bedford, Bryant, Hayden) sirve para cualquier tipo de sitio, desde organizaciones sin fines de lucro hasta avisos de bienes raíces. Banners y botones especiales y personalizables, navegación en barra lateral y una Página de índice con desplazamiento destacan tus productos, tu misión o la información de tus eventos. 

Esta guía se refiere a las funciones y a las opciones de diseño de la familia Bedford. Los ajustes de Estilos del sitio están en negritas y se vinculan a la lista de todos los ajustes de Bedford para ayudarte a navegar por el panel.

Consejo: Las páginas de Vista previa en vivo de Anya, Bedford, Bryant y Hayden muestran sitios reales de clientes que usan estas plantillas.

Tipos de páginas que se admiten

Bedford admite estos tipos de páginas:

Encabezado

Los visitantes usan el encabezado de la parte superior para navegar por el sitio. En Bedford, el encabezado tiene el título o el logotipo del sitio web y la Navegación principal. No aparecen los mensajes. El encabezado está fijo en las Páginas de índice.

Modifica el título o el logotipo del sitio web en la sección Encabezado del sitio.

  • Usa Transparente en las imágenes de banners para elegir si la personalización de la marca y la navegación se superponen sobre los banners de la página o sobre el Color de fondo del encabezado.
  • Cambia el tamaño del logotipo con el Ancho del contenedor del logotipo. La altura máxima está fija en, alrededor de, 100 píxeles, y el logotipo no se escalará más de eso. 

Usa los ajustes de Navegación del sitio para cambiar las configuraciones de visualización para la Navegación principal.  

  • Cuando Habilitar el botón de navegación está marcado, la última página de la Navegación principal se ve como un botón. Cambia su aspecto con los ajustes de Botón de navegación. Las carpetas no se convierten en botones. 
  • Si no hay suficiente espacio en la ventana del navegador para que los enlaces de navegación se extiendan en el encabezado, aparecerá un ☰. 

encabezado de bedford

Cabeceras

Añade imágenes y videos sin bordes en el banner de la parte superior de tus páginas; luego, haz una superposición de estas con encabezados, texto y botones personalizables. Puedes añadir imágenes y videos de banners a las siguientes opciones:

  • Páginas de Diseño
  • Páginas de Álbum
  • Páginas y publicaciones de blogs
  • Páginas de eventos y eventos individuales
  • Páginas de Productos

Ten en cuenta lo siguiente:

  • Puedes marcar Transparente en las imágenes de banner en Encabezado del sitio para que aparezca el contenido del encabezado sobre el banner.
  • Puedes añadir banners en modo presentación a las Páginas de diseño y de blog.
  • Puedes apilar varios banners en las Páginas de índice.
  • Para todos los banners, usa los ajustes de la sección Banner para cambiar las fuentes, los colores y los estilos para los botones y las superposiciones de texto.

Page banners

Crea una imagen o video de banner en la parte superior de las páginas de Diseño, Álbum, Blog, Eventos o Productos añadiendo imágenes en miniatura o URL de videos en la configuración de página.

Agrega una superposición de texto en el campo de Descripción de página de la pestaña General. Puedes formatear el texto como encabezados y botones. El texto del Título de la página no aparece.

Slideshow banners

Crea un banner en modo presentación en la parte superior de una Página de diseño añadiendo un Bloque de galería en modo presentación como el primer bloque de la página.

  • El Bloque de galería no aparecerá en la página. 
  • Los banners en modo presentación reemplazan a los banners de la página. 
  • Los videos añadidos en el Bloque de galería aparecen en el banner, pero no se reproducen automáticamente. Incluyen sonido y muestran el texto del banner.
  • Para obtener los mejores resultados, marca Recortar las imágenes automáticamente en la pestaña Diseño del editor de bloques. 
  • Si tu banner tiene una superposición de texto, marca Mostrar el título y la descripción en la pestaña Diseño. No aparecerá el título.
  • Slideshow banners have a fixed height:
    • Computadoras de escritorio: 600 píxeles. Si el encabezado es transparente en las imágenes del banner, la altura de la imagen fija llega a 700 píxeles. 
    • Dispositivos móviles: 300 píxeles. (Los dispositivos con pantallas de más de 640 píxeles tienen la altura del banner de las computadoras de escritorio).
  • Las Páginas de blog también crean banners en modo presentación con las publicaciones destacadas. 

Para añadir texto superpuesto, haz clic en una imagen y agrega texto en el campo Descripción. Si vinculaste con una galería existente, actualiza las descripciones en la Página de galería. 

  • Puedes formatear el texto como encabezados y botones. 
  • Si el texto en una cabecera tipo presentación es demasiado largo como para caber en la altura fija, no se mostrará el texto de la descripción sin negrita. El texto en negrita aparecerá recortado.

banner en modo presentación

Para los banners de página y en modo presentación:

  • Bold text formats as a header.
  • El texto normal tiene el mismo formato que el cuerpo del texto.
  • Los enlaces de la última línea asumen el formato de botones. El enlace no puede incluir texto en negritas ni ninguna otra línea después del enlace.
  • Agrega altura extra en el encabezado de la página añadiendo espacios en blanco

superposición de texto en la configuración de página

banner text and buttons.jpg

Banners en publicaciones de blog y de eventos

Las Miniaturas de los elementos de una colección aparecen en la parte superior de las publicaciones de blog y en cada evento. Estos banners tienen una altura fija.

  • Eventos: No aparece texto en el banner.
  • Publicaciones de blog: El título de la publicación y un elemento de metadatos (elígelo con el ajuste Prioridad de los metadatos) aparecen sobre la imagen del banner. 

Añadir un filtro de color

Añade un filtro de color en todas las imágenes o videos del banner con Color de la superposición del banner en la sección Banner

Más ayuda con los banners

Footers

Bedford incluye áreas de contenido en el pie de página y en el pre-pie de página que puedes personalizar con bloques

  • El pie de página y el pre-pie de página podrían incluir contenido automáticamente, por ejemplo, un Bloque de enlaces a las redes sociales o un Bloque de texto. Borra o edita estos bloques para reemplazarlos con tu propio contenido.
  • Los enlaces a texto en el pie de página y el pre-pie de página aparecen subrayados.
  • Los cambios que introduzcas en el pie de página aparecen en todo tu sitio. 

Usa los ajustes del Pie de página para modificar el estilo del contenido de tu pie de página:

  • Modifica el estilo de la Navegación del pie de página con los ajustes de Navegación del pie de página.
  • Usa el ajuste Centrar la navegación / información para alinear la Navegación del pie de página y la información de contacto.
  • Emplea los ajustes de Información del sitio para modificar el estilo del número de teléfono, la dirección de correo electrónico y el lugar físico desde tu Configuración de los d empresarial
  • Marca Ocultar la información del sitio para quitar toda la información de contacto.

Sidebar navigation

Bedford crea barras laterales de navegación en las páginas de carpetas y en los Índices y barras laterales de navegación por categorías en las Páginas de productos.

  • Usa los ajustes de la Barra lateral para ajustar las fuentes y los colores, ocultar los títulos de la barra lateral o directamente ocultar la barra lateral de navegación.
  • La barra lateral de navegación no admite bloques.
  • Cada página que se añade a una carpeta aparece como enlace en una barra lateral de navegación. La barra lateral aparece en todas las Páginas de diseño de la carpeta.
  • Las páginas de un Índice solo muestran la barra lateral de navegación cuando se visita la URL directa de cada página. 
  • En las Páginas de productos, la barra lateral de navegación muestra enlaces a las distintas categorías de productos. Hacer clic en uno de los enlaces filtra todos los productos, excepto los que pertenecen a dicha categoría.

Products Page sidebar navigation.jpg

Background and fonts

Usa los ajustes de Contenido principal para modificar el estilo de tu área principal de contenido:

  • Selecciona el color del fondo con Fondo de la página.
  • Ajusta el estilo, el tamaño y el color del texto con los ajustes Texto de la página y Encabezado.

El encabezado del sitio, la barra lateral de navegación y los banners de página tienen sus propias opciones de fuente y color.

Páginas de Índice

Las Páginas de índice convierten el contenido de varias páginas en secciones apiladas para que puedas destacar diferentes imágenes e información en una sola ubicación.

  • Las secciones de contenidos se forman a partir de las Páginas de diseño. Estas son una buena opción para añadir texto, botones y otros bloques
  • Añade miniaturas de página para crear imágenes o videos de banner o para generar una presentación en el banner.
  • Modifica el estilo de los colores y de las fuentes de la Página de índice con los mismos ajustes que para otras páginas. No hay ajustes específicos para la Página de índice.
  • El título del sitio web y la Navegación principal permanecen en una posición fija cuando te desplazas más allá de la primera página. Usa el ajuste de Color del fondo del encabezado para modificar el color del fondo del encabezado fijo.
  • Las Páginas de índice aceptan enlaces ancla al Índice. Cuando los que visitan el sitio hacen clic en estos enlaces, saltarán a una sección específica de tu Página de índice. Para verlo en acción, haz clic en el botón "Ver nuestro trabajo", en el contenido precargado de Hayden.
  • Cuando visitas la URL directa de una página que es parte de un Índice, todas las páginas de ese Índice aparecen en la barra lateral de navegación

secciones de página de índice con navegación fija

Páginas de Blog

Las Página de blog de Bedford aparecen como una lista de publicaciones apiladas verticalmente:

  • Los fragmentos solo pueden contener texto. El texto de "Leer más" y la flecha tienen los mismos ajustes de fuente del Texto de la página y de Color del enlace de la página.
  • Cuando ves una publicación de blog en su URL directa, su imagen en miniatura aparece como un banner.
  • Cada publicación siempre muestra los tags, las URL de origen, los comentarios, las veces que se compartió y los "Me gusta". La navegación de la publicación anterior y posterior aparecen debajo de los comentarios.

Modifica el estilo de las Páginas de blog en la sección Blog:

  • Usa la Prioridad de metadatos para seleccionar la fecha, las categorías o el nombre del autor arriba del contenido de la publicación.
  • Quita la marca en Ocultar el pie de página de la entrada de lista para mostrar los tags, la URL de origen, los comentarios, las veces que se compartió y los "Me gusta" debajo de la publicación.
  • Para centrar el título y los metadatos de la publicación, marca Centrar el título y los metadatos de la entrada.
  • Muestra u oculta los autores del blog con Ocultar el autor de la entrada. Este ajuste no aparece si se ha seleccionado Prioridad de metadatos: Autor

publicación de blog

Sidebar

Cada Página de blog tiene una barra lateral que se puede personalizar. Todas las publicaciones de blog de ese blog también muestran la barra lateral.

Habilita las barras laterales quitando la marca en Ocultar la barra lateral del blog en la sección Barra lateral y, luego, añade contenidos con bloques

barra lateral de la página de blog

Slideshow banners

Las cinco publicaciones destacadas más recientes crean un banner en modo presentación en la página de aterrizaje.

  • Cada diapositiva muestra el título de la publicación de blog, un elemento de los metadatos (elígelo con el ajuste Prioridad de metadatos) y un enlace para Ver publicación.
  • La imagen en miniatura aparece detrás del texto. Si la publicación no tiene una imagen en miniatura, el texto aparece arriba del Color de la superposición del banner.
  • Usa el ajuste de Controles de la presentación del banner para regular los elementos de la navegación en tu banner del blog en modo presentación.
  • Si no has marcado ninguna de tus publicaciones como Destacada, aparece el banner de la página en la Página de blog.

Móvil

Gracias al diseño adaptativo integrado en Squarespace, tu sitio se adapta para lucir fantástico en cualquier dispositivo.

  • El contenido de la barra lateral aparece detrás del contenido de la página. 
  • Los banners en modo presentación tienen una altura fija de 300 píxeles. Si el texto del banner en modo presentación es demasiado largo, el texto de la descripción se oculta.
  • Puedes desactivar los estilos para dispositivos móviles, pero no recomendamos que lo hagas. 

Aparece un enlace Volver arriba en la parte inferior de la página. 

En los teléfonos inteligentes:

  • La navegación se contrae como ☰ en la parte superior derecha. El ☰ se muestra siempre en los dispositivos móviles, incluso si la Navegación principal está vacía.
  • El color del fondo de la superposición del menú es el mismo que el del encabezado.
  • Los pies de página que muestran la información empresarial incluyen un enlace al Correo electrónico, en lugar de la dirección de correo electrónico completa. 

vista en teléfono inteligente y en tableta

Opciones de idioma

Bedford admite dos opciones de idioma: 

¿Fue útil este artículo?
Usuarios a los que les pareció útil: 50 de 87
Familia de plantillas Bedford