Output path overrides

Where to set it

Overrides live in Webflow, not in WCH settings. You add them in the Webflow Designer:

  1. Select an element on the page, for example the Body or a wrapper div.
  2. Open Element settings and add a custom attribute.
  3. Enter one of the attribute names below and the path you want as the value.
  4. Publish in Webflow, then publish in WCH.

For CMS items there is also a wch-parent CMS field. See "The wch-parent CMS field" below.

How it works

Without an override, a Webflow page at /company/about is written to /company/about/index.html in your build. An override changes that file path. WCH reads the attribute when it builds the page and writes the file to the new location on your staging site, in archives, and at your destinations.

There are two overrides:

  • data-wch-output-path: sets the full path for the page.
  • data-wch-parent: keeps the page's own slug and puts it inside a different folder.

If a page has both, data-wch-output-path wins.

Both attributes are removed from the published HTML. Visitors never see them.

data-wch-output-path

The value is the full path you want the page published at.

<div data-wch-output-path="/offers/spring-sale">

The page at its Webflow URL is published to /offers/spring-sale/index.html.

Rules for the value:

  • A path without a file extension becomes a folder. WCH adds /index.html, so /offers/spring-sale and /offers/spring-sale/ both write /offers/spring-sale/index.html.
  • A path with a file extension is used as the filename. /offers/spring-sale.html writes exactly that file.
  • A leading slash is added if missing. offers/spring-sale is treated as /offers/spring-sale.
  • A full URL is reduced to its path. https://www.example.com/offers/spring-sale becomes /offers/spring-sale.
  • Repeated slashes are collapsed. //offers//spring-sale becomes /offers/spring-sale.
  • A blank value means no override. An empty attribute is ignored.
  • Only the first match counts. If several elements on the page carry the attribute, WCH uses the first one in the HTML.

data-wch-parent

The value is a folder. WCH puts the page inside it and keeps the page's own last path segment.

<body data-wch-parent="resources/guides">

A Webflow page at /getting-started is published to /resources/guides/getting-started/index.html. Slashes at the start and end of the value are ignored, so /resources/guides/ works the same.

Use it when you want a group of pages under one folder on your live site without renaming their slugs in Webflow.

The wch-parent CMS field

For CMS items, you can set the parent folder per item with a CMS field instead of an attribute.

  1. In your Webflow collection, add a plain text field and give it the slug wch-parent.
  2. For each item you want to move, enter the folder, for example resources.
  3. Publish the item in Webflow.

WCH puts the folder in front of the collection's own slug. An item my-post in a collection with the slug blog and a wch-parent value of resources is published to /resources/blog/my-post/index.html. Items with an empty field keep their normal path, /blog/my-post/index.html.

WCH reads this field for CMS items it receives through CMS webhooks. For those items the field decides the folder, and a data-wch-parent attribute on the template page is ignored. See Webhooks.

Using overrides on CMS template pages

To give every CMS item its own exact path, set the data-wch-output-path attribute on the Collection template page and connect its value to a CMS field. Each item then publishes to the path stored in that field. This works in every publishing mode, because WCH reads the attribute from the built page.

Localized sites

If a page's Webflow URL starts with a locale folder, such as /de/, WCH adds that folder to the override. With data-wch-output-path="/offers/spring-sale", the German page is written to /de/offers/spring-sale/index.html and the default page to /offers/spring-sale/index.html. If your value already starts with the locale folder, WCH does not add it twice.

This keeps each language on its own path, even though the attribute value is the same on every locale. See Localization and hreflang.

What else changes with the path

  • Canonical and hreflang links are rewritten to point at the new path, using your Project domain, or your Webflow site's domain if Project domain is empty.
  • sitemap.xml lists the page at its new path.
  • Root directory still applies. The override path is inside your Root directory, so /offers/spring-sale with a Root directory of marketing-site lands at marketing-site/offers/spring-sale/index.html. See File Prefix and Root directory.
  • Caching does not skip pages with an override. WCH always rebuilds them so it can see if you changed or removed the attribute. See Cache.

When it runs

WCH reads the overrides every time it builds a page: Publish all pages, Publish selected on the Rendering page, and publishes started by Webflow webhooks or CMS webhooks. Adding or changing an attribute does nothing until you publish the page in Webflow and then in WCH.

When a page moves, WCH removes the old copy from your staging build, so it is not in the next archive or deploy.

Removing an override

Delete the attribute in Webflow, or empty its value, and publish again. WCH moves the page back to its normal path and adds a warning to Project Logs naming the old and new paths. Click View logs to read it.

If another page already uses the normal path, WCH leaves the page where it is. Resolve the clash in Webflow and publish again.

Links and files at your destination

WCH does not change links to a page you moved. Links on other pages still point at the page's Webflow URL. Update those links in Webflow, or add a redirect from the old path at your host.

WCH does not apply redirects and does not delete files at your destinations. After a page moves, the copy at its old path stays at your host until you remove it. For S3, see Removing Dead Files During an S3 Publish. To list the redirects your Webflow site already has, see 301 Redirects.

Give each page a unique path. WCH does not stop two pages from claiming the same override, and one would overwrite the other.

Testing your changes

  1. Add the attribute to one page in Webflow and publish it there.
  2. In WCH, open Rendering, tick that page, and click Publish selected.
  3. Click the page and check Local path on the Configure tab. It shows the new path.
  4. Open the page on your staging site at the new path.
  5. Once it looks right, run Publish all pages and deploy.

Troubleshooting

  • Page still at its old path: the attribute was added in the Designer but the Webflow site was not published, or the page has not been published in WCH since.
  • Page landed under an extra locale folder: the Webflow URL starts with a locale. This is expected. Leave the locale out of the value.
  • CMS item path includes the collection slug: the wch-parent field goes in front of the collection slug, not in place of it. Use data-wch-output-path on the template page for full control.
  • Old page still served on the live site: WCH does not delete files at your destination. Remove the old copy there.
  • Page did not move back after removing the attribute: another page already uses its normal path. Remove or move that page in Webflow and publish again.