Setup

In order to add the Plenti CMS to your site you need to use 2 magic variables (content and user) that are provided to you by Plenti.

You have a great deal of flexibility in how to implement these on your site. Commonly you will add the admin menu to your entrypoint file (likely layouts/global/html.svelte) in a manner similar to this:

<script>
  export let content, user;
</script>

<html lang="en">
  <head></head>
  <body>
    {#if user && $user.isAuthenticated}
      <svelte:component this={$user.menu} bind:content {user} />
    {/if}
    <main>
      <svelte:component this={layout} {...content.fields} {user} />
    </main>
  </body>
</html>

Then on whatever page or popup you want to use to display the login, you can simply use $user.login() like this example:

<button on:click|preventDefault={$user.login()}>
  Login
</button>

For logout, there's a link provided to you by default in the admin menu, but you can implement your own workflow using $user.logout() like this:

<button on:click|preventDefault={$user.logout()}>
  Logout
</button>

The information above is enough to get you up and running locally. If you make changes through the admin interface, it will update your JSON locally, which you can then commit or discard with Git.

Remote / Deployed CMS

If you want to use the CMS on a deployed website, or hand it off to clients who don't use Git, you can configure a remote repository in your sitewide plenti.json configuration file:

{
  "cms": {
    "repo": "https://gitlab.com/my-org/my-repo",
    "redirect_url": "https://my-site.com",
    "app_id": "put oauth id here",
    "branch": "main"
  }
}