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

Bedford, Anya, Bryant, and Hayden share the same underlying structure and functionality. This guide applies to all these templates.

Esta guía te orienta sobre las opciones para ajustar el aspecto de tu sitio creado con Bedford, Anya, Bryant o Hayden. Estas opciones están disponibles en Estilos del sitio.

This is a supplement to the guide Making style changes, which we suggest you read first if you're new to Squarespace.

Consejo: En el Menú de Inicio, haz clic en Diseño y, luego, en Estilos del sitio. Para acceder a ajustes específicos de una página, navega hasta Estilos del sitio cuando estés en esa página en particular.

Supported pages

Add pages to your site to create your site's underlying structure. Pages can appear as links in your site's navigation.

Templates in the Bedford family support these page types:

  • Stacked Index - Create a long, scrolling page of stacked sections.
  • Blog - The list-style Blog Page stacks posts vertically.
  • Regular Page - A blank page you can customize with blocks.
  • Album - Create a page with playable music tracks and cover art.
  • Events - Create a calendar or list of events.
  • Gallery - Style the gallery as a slideshow or grid.
  • Products (Classic) - Sell goods and services with our integrated Commerce features.
  • Cover Page - A unique landing page styled separately from your template.


The site title and Main Navigation display at the top of the page. Use the Site Header tweaks to adjust the display settings of the site title.

The Transparent on Banner Images tweak determines whether the site title and navigation display as an overlay over page banners or over the Header Background Color.

The Site Navigation tweaks change the display settings for the Main Navigation. When Enable Nav Button is checked, the last page in the Main Navigation displays as a button. Use the Nav Button tweaks to adjust how it looks.

Note: Only the last page in the Main Navigation can become a button. A folder won't become a button. 

If there's not enough room in the browser window for the navigation links to display across the header, a menu ("hamburger") icon displays instead. Click the menu icon to display a navigation overlay.

Note: The menu icon always appears on smartphones.

If you replace the site title with a logo, you can resize it with the Logo Container Width. The maximum height is fixed at about 100 pixels. After the logo reaches that height it will no longer scale up.

These templates don’t display a tag line. Index Pages feature a special fixed header option.

Note: To learn how to adjust what pages display in the navigation menu, visit Adding pages to your navigation.

Special banners

Visit the Special banners guide to learn how to add banner images, videos, text, and buttons, and create slideshow banners on certain pages.

Descripciones de página

La descripción de página en Configuración de Página crea una superposición de texto para los banners de página. Utiliza las opciones de formato especiales para crear encabezados y botones. Si deseas obtener más información, consulta Banners especiales.

Los títulos de las páginas no se muestran.

Consejo: Si deseas usar un texto diferente para los resultados de búsqueda, agrega una descripción SEO.


Add a folder to the Main Navigation to create a drop-down menu of links.

When you click the folder name, it takes you to the first page or link in the folder. When opened this way, links set to Open in New Window won't open in a new tab.

Sidebar navigation

Bedford supports a navigation sidebar on pages within folders and Indexes, and a category navigation sidebar on Products Pages.

  • Para todas las barras de navegación lateral, usa los retoques de la secciónBarra lateral en Estilos del sitio para ajustar las fuentes y los colores, ocultar el título de la barra lateral o, directamente, ocultar la barra de navegación.
  • Sidebar navigation doesn't support adding content with blocks.

Folders and Index Pages

Every page added to a folder appears as a link in a sidebar navigation. The sidebar navigation displays on any Regular Page within the folder, showing visitors all available pages and helping them move from page to page.

Pages within an Index display sidebar navigation in the same way, but only if you go to the direct URL for the individual page. The navigation won’t show when viewing the Index Page itself.

Product category navigation

A sidebar navigation appears on Products Pages, displaying links to the different product categories. Clicking one of these links filters out every product except the ones in that category.

Blog Page sidebar

Each Blog Page on your site supports a content sidebar on the landing page and all posts. You can customize this with blocks.


These templates support footer and pre-footer content areas. To customize these areas with blocks, hover over the footer and click Edit. Any changes you make to the footer will appear throughout your site.

Certain content auto-populates in the footer:

  • Secondary Navigation displays between the pre-footer and the footer. Style this with the Footer Nav tweaks.
  • Contact information you’ve added in the Phone Number, Email, and Physical Location section of the Business Information panel displays at the top of the footer, below the Secondary Navigation. Style this with the Site Info tweaks. Hide it by checking Hide Site Info.
  • Align both the Secondary Navigation and contact info with the Center Navigation / Info tweak.
  • Depending on your template, your footer and pre-footer content areas may contain content such as a Social Links Block or Text Block. Delete or edit these blocks to replace them with your own content.

En la sección Pre-pie de página de Estilos del sitio, encontrarás retoques para ajustar los colores del fondo y del texto. En la sección Pie de página, encontrarás los retoques de formato para el color del fondo, los vínculos de navegación secundaria y la información del sitio. Marca Ocultar la información del sitio para quitar la información de contacto.

Background and fonts

Usa la sección Contenido principal de Estilos del sitio para modificar el estilo de tu área de contenido principal:

  • Page Background - Set the background color
  • Page Text and Heading tweaks - Adjust the style, size, and colors for your site's text.
Note: The site header, sidebar navigations, and page banners have their own fonts and color options.

Íconos de las redes sociales

These templates don't support built-in social icons. Instead, add a Social Links Block to the footer or to your page content.


Because Squarespace templates are built with responsive design, your site will adjust on mobile devices to better fit the format of that device. You can use Device View to see how your site will look on different devices.

  • Logos remain visible on mobile.
  • Sidebar content displays beneath page content on mobile. 

On smartphones, the navigation displays as a menu icon in the top right.

  • Tap the menu icon to display an overlay with your navigation links.
  • The overlay's background color is the same as the header's.
  • El ☰ se muestra siempre en dispositivos móviles, incluso si la navegación principal está vacía.

On mobile devices, a Back To Top link displays at the bottom of the page. This link doesn't display in Device View. 

  • The Back To Top link follows the Footer Nav Font and Footer Nav Link Color tweaks.
  • To adjust the link's text, you may need to temporarily add pages to your Secondary Navigation so that those tweaks appear.

On smartphones, footers that show business information display an Email link, instead of a full email address. 


Images on grid Gallery Pages will be stacked on a smartphone. Slideshow Gallery Pages have one main image with adjustable navigation elements below it.

  • A veces, los banners de video no se muestran en dispositivos móviles, dependiendo de la velocidad de conexión del visitante y de la versión del navegador. Configura que aparezca una imagen de reserva para dispositivos móviles cuando el banner de video no se pueda cargar.
  • See our troubleshooting tips for mobile banner cropping issues.
  • On mobile, slideshow banners have a set height of 300 pixels. If the text on a slideshow banner is too long to fit within the 300-pixel height, the description text will be hidden in mobile view.

Nota: Puedes desactivar los estilos para dispositivos móviles.

Next step

Learn how to create a vertically-scrolling Index Page.

¿Fue útil este artículo?
Usuarios a los que les pareció útil: 21 de 50
Bedford structure and style