Note: While our most popular guides have been translated into Spanish, some guides are only available in English.
Using the Farro template

Farro and Haute are in the same template family. This means they share the same underlying structure and functionality. The directions in the Farro guides apply to both templates.

See the left navigation for information about building and customizing specific parts of your site. If you haven't yet picked a template, you can get help with initial installation at Getting started with Squarespace.

Note: Visit the Farro and Haute Live Preview pages for examples of real customer sites using these templates. If you've already created a site, you can switch your template at any time.

Special features

Farro and Haute are highly-customizable templates designed for bloggers, news sites, and anyone who publishes a large volume of content. The blog landing page has multiple striking layout options, helping you highlight your content and share it with the world.

Sophisticated Blog Page

The blog landing page features a customizable grid of thumbnail image tiles, each linking to a different blog post. This grid acts as visual navigation, allowing visitors to browse through all your posts in one place.

Interactive post features

Help visitors explore your content with Related Posts at the bottom of each blog post, dedicated author profiles, and customizable Share buttons. 

Intro areas

Gallery, Album, Events, and Products Pages all feature a special header area below the site header, which you can personalize with content like text, images, and video.

Customizable headers and navigation

These templates support three separate navigation areas and a flexible header layout. Visit Structure and style to learn more.

Commerce options

Highlight your merchandise with advanced Commerce features like Quick View, Product Image Zoom, and on-hover effects.

Mobile style

Control how your site appears on smartphones and other reduced-width browser windows.

Quick start

Certain tweaks and settings can make a big impact on how your site looks and behaves. Play with the following options until you settle on a design you love.

To open any panel, press the ? key and search for its name. 

Site

Open the Style Editor panel. These are some key tweaks that affect the whole site:

  • Site > Site Background
  • Site: Border > Show Border
  • Header: Layout > Branding Position
  • Header Design > Background
  • Main > Content Width
  • Footer > Background Color 

Blog Page

First, create a Blog Page and add blog posts with thumbnail images. Then go to your Blog Page and open the Style Editor. Here are some key tweaks:

  • Blog: List > Layout and Aspect Ratio
  • Blog List: Load > Method
  • Blog: Meta > Top Primary and Bottom Primary
  • Blog: Design > Alignment and Overlay Color 

Blog posts

While on any blog post, open the Style Editor. Here are some key tweaks:

  • Blog: Item > Show Author Profile
  • Blog: Item > Header
  • Blog Item: Pagination > Pagination
  • Share Buttons > Style and  Standard Color
  • Main > Content Inset 
  • Blog: Item > Use Unique Lede Font and Lede Color - For posts with more than one paragraph of text at the top of the page

Outside the Style Editor, you can enable Related Posts in the Features tab of Blog Page Settings, and add comments by going to Home Menu > Settings > Blogging > Comments Settings.

Mobile

Use Device View to see what your site looks like on mobile. Here are some key tweaks:

  • Mobile: Menu Icon > Menu Icon Position
  • Mobile: Top > Fixed Mobile Top
  • Mobile: Top > Top Background 

Next step

For an in-depth overview of the available style options, visit Structure and style.

Was this article helpful?
5 out of 9 found this helpful
Using the Farro template