Load Lemon Sicus button with custom settings and display content.

by lemniscus

HTML

<link
  rel="stylesheet"
  href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap/5.3.8/css/bootstrap.min.css"
/>

<script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap/5.3.8/js/bootstrap.min.js"></script>

<!--
lemniscus Online-Termin Button

Pflicht:
- data-pss-token   Dein PSS-Token aus dem Portal

Optional – Position:
- data-side        right | left (Standard: right)
- data-height-pct  vertikale Position in Prozent (Standard: 50)

Optional – Design:
- data-theme       blue | dark | light (Standard: blue)
-->
<script
    id="lemmyFlansch"
    data-floating-side="right"
    data-token="cc1004e4-46be-449f-b0da-e977d10c9901"
    src="https://my.lemniscus.de/js/lemmyFlansch.js"><!-- das hier nicht löschen --></script>


<div class="container py-4">
  <img class="mb-4 img-fluid" src="https://picsum.photos/500/200" />

  <h1>Lorem ipsum</h1>

  <p>
    Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy
    eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam
    voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet
    clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit
    amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam
    nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed
    diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet
    clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit
    amet.
  </p>

  <ul
    class="nav nav-pills nav-fill gap-2 p-1 m-4 small bg-primary rounded-5 shadow-sm"
    id="pillNav2"
    role="tablist"
    style="--bs-nav-link-color: var(--bs-white); --bs-nav-pills-link-active-color: var(--bs-primary); --bs-nav-pills-link-active-bg: var(--bs-white);"
  >
    <li class="nav-item" role="presentation">
      <button
        class="nav-link active rounded-5"
        id="home-tab2"
        data-bs-toggle="tab"
  ...