Trio Icon
Trio v6.1.0
Documentation is evolving and is a WIP

Linking Conventions

Linking Conventions For Pages

Trio supports the following linking conventions for pages:

  • Absolute URLs (e.g. <a href="https://somesite.com/blog/">) are appropriate to use when linking to both remote pages and to your site's internal pages.
  • Site Relative URLS (e.g. <a href="/blog/">) are appropriate to use when linking to your site's internal pages.
  • Page Relative URLs (e.g. <a href="../blog/">) are appropriate to use when linking to your site's internal pages.
  • Linking Conventions For Assets

    Trio supports the following linking conventions for assets (e.g. .js, .css, .jpg, etc.):

    If you intend to cache bust your site's assets then you are required to construct your site's asset URLs using either site relative or absolute URLs.

  • Absolute URLs (e.g. <a href="https://somesite.com/media/roaringlion.jpg">) are appropriate to use when linking to both remote assets and to your site's internal assets and when used to link to your site's internal assets are compatible with Trio's cache busting feature.
  • Site Relative URLS (e.g. <a href="/media/roaringlion.jpg">) are appropriate to use when linking to your site's internal assets and are compatible with Trio's cache busting feature.
  • Page Relative URLs (e.g. <a href="../media/roaringlion.jpg">) are appropriate to use when linking to your site's internal assets but are not compatible with Trio's cache busting feature.
  • Base URL

    Some Web hosting services deploy sites in subfolders, and require that their site relative URLs begin with the subfolder's path.

    For example, the site at https://4awpawz.github.io/trio-docs-pages is hosted on Github Pages, and linking internally with <a href="/docs/v1">Documentation</a> wouldn't work but linking with <a href="/trio-docs-pages/docs/v1">Documentation</a> would work.

    In this case, you can decorate any HTML tag that has a src or href attribute using the data-trio-link attribute,

    <a data-trio-link href="/docs/v1">Documentation</a>

    and in your project's root/trio.json configuration file you would then assign the subfolder's path to baseUrl. When you build your site, Trio will prepend these URLs with the path that you assigned to baseUrl.

    See Also

    Your Financial Support Of This Project Is Greatly Appreciated

    Trio is an open source project and is therefore free of charge to use both for noncommercial and commercial use, but when you use Trio to create a new website, please consider donating a few bucks. It doesn't take very long, the process is secure, and it will allow us to continue to support the community and to maintain and enhance Trio going forward.

    Show your ❤️, add your ★ to the Github repo.