Squarespace Developer Platform: APIs, Apps, and Docs
Changes

[Upcoming Change] DOM structure changes for 7.1 standalone pages

Date: July 2026

What's Changing: We're changing the HTML structure of standalone pages for 7.1 websites in a way that may affect custom CSS. These changes are scheduled to begin rolling out to websites starting in mid-July.

What's a "standalone page"?

A standalone page is any page that isn't a collection page (i.e. not Stores, Blogs, Portfolios, or Events).

What's changing

Current legacy DOM structure

Code
<article class="sections" id="sections" data-page-sections="{pageSectionsId}">
  <section class="page-section">
    ...
  </section>
  <section class="page-section">
    ...
  </section>
</article>

New DOM structure

The new DOM structure wraps page sections in an additional <section> tag. On standalone pages, all user sections are grouped inside a single region:

Code
<article class="page-regions" id="page-regions"
  data-collection-id="{collection.id}"
  data-item-id="{item.id}"
  data-regions-source="collection">
  <section class="region" data-region-id="{regionId}">
    <section class="page-section">
      ...
    </section>
    <section class="page-section">
      ...
    </section>
  </section>
</article>

Custom code impact

The changes will apply to all standalone pages on all 7.1 sites. As shown in the examples above, page sections on standalone pages will be nested one level deeper in the DOM, so you may need to update custom CSS targeting the current page structure to ensure it works as expected.

The most likely selectors that will need updating are those that depend on the current section hierarchy, including:

  • Direct child selectors like .sections > .page-section, #sections > .page-section, and article > section
  • Pseudo-elements applied broadly to section, like section::before and section::after
  • Selectors that rely on a section being the first, last, or nth child in the current structure. More details:
    • article > *:first-child will break
    • section:first-child won't break but will also apply to the new section.region element (likely unintended)
    • section.page-section:first-child will work as expected

What's next

If you manage sites with custom CSS on standalone pages, we recommend that you audit any custom CSS targeting page sections by DOM structure and update it. Keep in mind that only custom code that is written to our official spec should be considered stable and insulated from changes like the one described here.

Self-Service OAuth Credential ManagementProductItem-additional deprecation