Getting Started Introduction Installation UpgradingContent Types PathsStructure Layouts Media Themes StaticConfiguration Baseurl PaginationMagic Variables allContent allLayouts paramsCommands New Site New Type Build Serve EjectTheme Commands Theme Add Theme Enable Theme Disable Theme Update Theme RemoveDeployment GitHub Actions GitLab Pipelines Gitea ActionsCMS Setup Configuration 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.