Development

Environment

When you are ready to deploy your site, you will need to modify environment variables to reflect how your site is hosted. The NEXT_PUBLIC_URL variable is used to declare the base URL of your site. This base url is critical to routing of works in Canopy and wiring up canonical links in SEO.

Modify Environment Variables

NEXT_PUBLIC_URL="https://canopy-iiif.github.io"
NEXT_PUBLIC_BASE_PATH="/canopy-iiif"

Edit the .env file at the root of the working directory to reflect your site's production configuration.

Root Base Path

If your project is hosted at the root of the public URL, NEXT_PUBLIC_BASE_PATH is defined as an empty string.

https://exhibit.library.northwestern.edu (opens in a new tab)

NEXT_PUBLIC_URL="https://exhibit.library.northwestern.edu"
NEXT_PUBLIC_BASE_PATH=""

GitHub Pages

GitHub Pages is a popular hosting solution for static sites. When hosting on GitHub Pages, you will need to set the NEXT_PUBLIC_BASE_PATH to reflect the repository name.

https://markpbaggett.github.io/abolition-now (opens in a new tab)

NEXT_PUBLIC_URL="https://markpbaggett.github.io"
NEXT_PUBLIC_BASE_PATH="/abolition-now"

Subdirectory as Base Path

You may need to host your site in a subdirectory. This follows the same pattern as GitHub Pages, but you will need to set the NEXT_PUBLIC_BASE_PATH to reflect the subdirectory.

https://example.org/exhibit (opens in a new tab)

NEXT_PUBLIC_URL="https://example.org"
NEXT_PUBLIC_BASE_PATH="/exhibit"

Avoid Code Conflicts

To avoid potential code conflicts on future release updates, it is advised not to update the following integrated Canopy pages in the Next.js pages directory.

Note: Future considerations will be delivered upon for updating content within these pages.

Analytics and Tracking

Canopy provides a way to add Google Analytics or Google Tag Manager to your project. The vendor property is optional and can be added to the config/canopy.json file. Read more about Vendor Configuration.