Skip to main content

Installation

The Participaite Unified Plugin requires only two steps: configuration and script inclusion.

Step 1: Configuration​

Add the configuration object before the script tag. The configuration tells the plugin which features to enable and how to behave.

Minimal Configuration (Translation)​

<script>
  window.PTP_TRANSLATE_CONFIG = {
    translator: {
      enabled: true,
      sourceLang: "de",
      targetLangs: [{ code: "en" }],
    },
  };
</script>

Full Feature Configuration​

<script>
  window.PTP_TRANSLATE_CONFIG = {
    // Translation feature
    translator: {
      enabled: true,
      sourceLang: "de",
      targetLangs: [
        { code: "en", label: "English" },
        { code: "fr", label: "Français" },
        { code: "es", label: "Español" },
      ],
      buttonPlacement: {
        type: "floating",
        position: "bottom-right",
      },
    },

    // Einfache Sprache feature
    EAS: {
      enabled: true,
      buttonPlacement: {
        type: "floating",
        position: "bottom-left",
      },
    },

    // Leichte Sprache feature
    LS: {
      enabled: true,
      targetElementSelector: "main",
      buttonPlacement: {
        type: "above",
      },
    },
  };
</script>

Step 2: Include the Script​

Add the script tag after your configuration:

<script src="https://translator.participaite.de/ptp-translate-plugin"></script>

Complete Example​

<!DOCTYPE html>
<html lang="de">
  <head>
    <meta charset="UTF-8" />
    <title>My Website</title>
  </head>
  <body>
    <main>
      <h1>Welcome to our website</h1>
      <p>This content can be translated and simplified.</p>
    </main>

    <!-- Participaite Configuration -->
    <script>
      window.PTP_TRANSLATE_CONFIG = {
        translator: {
          enabled: true,
          sourceLang: "de",
          targetLangs: [{ code: "en" }, { code: "fr" }],
        },
        EAS: {
          enabled: true,
        },
        LS: {
          enabled: true,
          targetElementSelector: "main",
        },
      };
    </script>

    <!-- Participaite Script -->
    <script src="https://translator.participaite.de/ptp-translate-plugin"></script>
  </body>
</html>

Feature-Specific Installation​

You can enable only the features you need:

Translation Only​

<script>
  window.PTP_TRANSLATE_CONFIG = {
    translator: {
      enabled: true,
      sourceLang: "de",
      targetLangs: [{ code: "en" }, { code: "fr" }],
    },
  };
</script>
<script src="https://translator.participaite.de/ptp-translate-plugin"></script>

Einfache Sprache Only​

<script>
  window.PTP_TRANSLATE_CONFIG = {
    EAS: {
      enabled: true,
    },
  };
</script>
<script src="https://translator.participaite.de/ptp-translate-plugin"></script>

Leichte Sprache Only​

<script>
  window.PTP_TRANSLATE_CONFIG = {
    LS: {
      enabled: true,
      targetElementSelector: "main",
    },
  };
</script>
<script src="https://translator.participaite.de/ptp-translate-plugin"></script>

CDN Information​

  • URL: https://translator.participaite.de/ptp-translate-plugin
  • Size: ~15 KB (gzipped)
  • Loading: The script loads asynchronously and initializes automatically
  • Fallback: The script includes automatic fallbacks for loading issues

Verification​

After installation, you should see the configured buttons appear on your page:

  • Translation: Language dropdown button
  • EAS: "Einfache Sprache" toggle button
  • LS: "Leichte Sprache" toggle button

Open your browser's developer console to check for any configuration errors or warnings.

Next Steps​