Getting Started Introduction Installation Upgrading Content Types Paths Structure Layouts Media Themes Static Configuration Baseurl Pagination Magic Variables allContent allLayouts params Commands New Site New Type Build Serve Eject Theme Commands Theme Add Theme Enable Theme Disable Theme Update Theme Remove Deployment GitHub Actions GitLab Pipelines Gitea Actions CMS Setup New Content Content Components Discoverability Media Field Widgets

Baseurl

Base element

Standard HTML has a base element that is prepended to all relative URLs and can be used to serve your site from a subfolder (e.g. mysite.com/my-subfolder/), which is common on platforms like GitLab Pages.

Implementation

In your sitewide plenti.json configuration file, you can specify a baseurl like this:

{
  "baseurl": "/my-subfolder/"
}
The local webserver (plenti serve) will serve the root of your site from that subfolder: http://localhost:3000/my-subfolder/.

The baseurl information gets added to a magic variable called env that you can add to the <head> element like this:

<script>
  export let env;
</script>

<head>
  <base href="{env.baseurl}">
</head>
(Note: make sure to first pass env from the parent component, likely layouts/global/html.svelte)

Usage

Now that your site is configured to use baseurls, you need to make sure you're actually using relative links (about), not root relative links (/about) or absolute links (https://mysite.com/about). You'll also want to update all links back to your homepage to use a dot . instead of a forward slash /in order to work with the base element correctly when deployed.