Note: While our most popular guides have been translated into Spanish, some guides are only available in English.
Wells structure and style

This guide walks you through the options for adjusting the look and feel of your Wells site. These options are available in the Style Editor.

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

Tps: In the Home Menu, click Design, then Style Editor. To access tweaks specific to a page, navigate to the Style Editor when on that specific page.

Supported pages

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

Wells supports these page types with template-specific features:

  • Gallery - Display your images and videos in slideshow or thumbnail view
  • Blog - The list-style Blog Page stacks posts vertically

And these standard pages:

  • Regular Page - A blank page you can customize with blocks
  • Album - Add music and cover art to your site
  • Events - Create a calendar or list of events
  • Products (Classic) - Sell goods and services with our integrated Commerce features
  • Cover Page - A unique landing page styled separately from your template
Tip: If you're new to Squarespace, we suggest you read Understanding the Pages panel and Adding pages to your navigation for an overview of how pages and content work in Squarespace.

Sidebar

Wells features a navigation sidebar on all pages. The sidebar can contain:

  • Your site title and tag line
  • Main Navigation and Secondary Navigation
  • A customizable content area
  • Social icons
  • Gallery Page navigation

Use the tweaks in the Sidebar Options section of the Style Editor to adjust its width and position.

Sidebar Text Alignment aligns the navigation links (left, right, or center).

When Sidebar Fixed is checked, the navigation links stay fixed in place. When unchecked, the sidebar moves up the page as you scroll:

Wells supports an additional customizable sidebar on Blog Pages. To learn more, visit the Blog section of the Wells pages and content guide.

Site title and tag line

The site title and tag line display at the top of the sidebar.

Use the Site Title & Logo panel to adjust the site title and tag line, delete the tag line, or replace the site title with a logo.

  • The tweaks in the Site Title / Logo Options section of the Style Editor adjust the style of these elements.
  • Subtitle tweaks affect the tag line.

Navigation

The sidebar in Wells displays both Main Navigation and Secondary Navigation. The Main Navigation links are by default larger and bolder than Secondary Navigation links.

Use the Site Navigation Options section of the Style Editor to style the font, size, and color of the navigation links. The Active and Hover color tweaks affect both Main Navigation and Secondary Navigation.

Add drop-down menus to the navigation with folders.

Sidebar content area

To add text, images, and more to your sidebar, hover over the area below the navigation until the Header Content annotation appears, then click Edit. Add content with blocks

Note: The content area doesn't display on mobile.

Background

Use the Site Background tweak in the Site Wide Options section of the Style Editor to change the background color of your site. Wells doesn’t support background images.

Social Icons

Social icons link to your connected accounts. Uncheck Hide Social Icons in the Social Link Options section of the Style Editor to display social icons in the sidebar. Use the other tweaks in that section to adjust their size and style.

Footer

Wells doesn't offer a footer. For a list of templates with footers, visit Editing footers.

Font styling

Use the tweaks in the Site Wide Options section of the Style Editor to adjust the font, size, and color of the headers, body text, and body text links throughout your site. The Headings tweaks adjust all text set as Heading 1, Heading 2, or Heading 3.

Mobile

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

Select Mobile Site Title Style: Manual in the Site Title / Logo Options section of the Style Editor to customize the font and size of the site title in mobile view.

Logos remain visible on mobile. Use the Mobile Logo Image Size tweak to adjust the size.

On mobile devices, a Menu link appears in the top-right corner.

  • When you tap the menu link, an overlay with your navigation links appears.
  • The overlay background color matches the Navigation (Active) Color.
  • The navigation links match the Site Background color.
  • The sidebar content area doesn't display.

Note: You can disable mobile styles in the Advanced panel.

Next step

Showcase your videos and images with an interactive Gallery Page.

Was this article helpful?
10 out of 17 found this helpful
Wells structure and style