Lestis für Entwickler, Analytics & Marketing

Dieser Bereich richtet sich sowohl an Entwickler, die das Design per Code anpassen möchten, als auch an Nutzer, die eigenständig Werbekampagnen verwalten oder Web-Analytics integrieren möchten.

🎨

Custom Design

📈

Analytics & ADS

🍪

DSGVO-konform

Code-Block-Verwaltung

Benutzerdefiniertes CSS

Geben Sie hier Ihre Design-Regeln ein. Dieser Block wird vor allen Skripten in den Head eingefügt.


                            <style>

                              .hero-custom { ... }

                            </style>

✔ Muss Tags enthalten <style>
✔ Ideal für Tailwind-Overrides

JS Global Head

Skripte, die sofort geladen werden. Ideal für externe Bibliotheken oder Analytics ohne Einwilligungspflicht.


                            <script>

                              // Global Logic

                            </script>

✔ Erfordert Tags <script>
✔ Wird vor dem Body geladen

GDPR JS Widget

Der hier eingegebene Code wird erst nach der Zustimmung des Nutzers zu Cookies ausgeführt.


                            fbq('track', 'PageView');

                            gtag('event', 'conversion', {...});

                            chat.init();

❌ KEINE Tags einfügen<script>
✔ Ausführung in einer try/catch-Sandbox

Wie der Code ausgeführt wird

Custom CSS: Der CSS-Block wird zuletzt angewendet, um maximale Priorität zu gewährleisten.

JS Global Head: Wird als Letztes injiziert, um bei Bedarf mit anderen geladenen Skripten zu interagieren.

GDPR JS Widget:

Wird erst nach Klick auf "Akzeptieren und Widgets aktivieren" oder bei bereits vorliegender Einwilligung ausgeführt.

🚀 Jetzt ausprobieren!

Kopieren Sie diese Beispiele in Ihre Backend-Blöcke, um das Design Ihrer Website sofort in eine "Luxury Gold"-Version zu verwandeln.

🎨 Einfügen in: Benutzerdefiniertes CSS

<style>
/* Import di un font elegante */
@import url('https://fonts.googleapis.com/css2?family=Playfair+Display:wght@700&family=Inter:wght@400;600&display=swap');

:root {
    --primary-gold: #d4af37;
    --dark-bg: #1a1a1a;
}

/* 1. Global & Fonts */
body {
    font-family: 'Inter', sans-serif;
}
h1, h2, h3, .font-extrabold {
    font-family: 'Playfair Display', serif !important;
    letter-spacing: -0.02em;
}

/* 2. Menu & Navigation */
header {
    background-color: var(--dark-bg) !important;
    border-bottom: 2px solid var(--primary-gold);
}
header nav a {
    font-family: 'Playfair Display', serif;
    color: #ffffff !important;
    text-transform: uppercase;
    font-size: 0.85rem;
    letter-spacing: 1px;
}
header nav a:hover { color: var(--primary-gold) !important; }

/* 3. Buttons & UI */
.bg-indigo-600 {
    background-color: var(--primary-gold) !important;
    border-radius: 0px !important; /* Look sharp */
    font-family: 'Playfair Display', serif;
    transition: all 0.3s ease;
}
.bg-indigo-600:hover {
    background-color: #b8962e !important;
    transform: translateY(-2px);
    box-shadow: 0 10px 20px rgba(0,0,0,0.2);
}

/* 4. Spacing */
.container { padding-left: 2rem; padding-right: 2rem; }
main { gap: 4rem; }

/* 5. Winner Box Style */
#winner-box {
    position: fixed;
    bottom: 20px;
    right: 20px;
    background: var(--primary-gold);
    color: black;
    padding: 15px 25px;
    font-weight: bold;
    border-radius: 4px;
    box-shadow: 0 4px 15px rgba(0,0,0,0.3);
    z-index: 9999;
    display: none;
    font-family: 'Playfair Display', serif;
}
</style>

⚡ Einfügen in: JS Global Head

<script>
  document.addEventListener("DOMContentLoaded", function() {
    // BOX "WINNERS"
    if (!document.getElementById('winner-box')) {
        const winnerBox = document.createElement('div');
        winnerBox.id = 'winner-box';
        winnerBox.innerHTML = '<small>20% DISCOUNT CODE:</small> WINNERS';
        document.body.appendChild(winnerBox);

        setTimeout(() => {
            winnerBox.style.display = 'block';
            winnerBox.classList.add('animate-bounce');
        }, 1000);
    }
  });
</script>

<script>
  document.addEventListener("DOMContentLoaded", function() {
    console.log("Lestis Custom Mode Active!");
    const footerConcat = document.querySelector('footer p');
    footerConcat.innerHTML += " - <b>Proudly Customized</b>";
  });
</script>

⚠️ Best Practices für Widgets

Fügen Sie externe Skripte in den globalen Block ein, wo das -Tag erforderlich ist, und verschieben Sie die Logik in den Block, der NUR DANN ausgeführt wird, wenn der Besucher Cookies akzeptiert hat, um rechtliche Probleme zu vermeiden.

Entwickler-FAQ

Kann ich serverseitigen Code ausführen?

Nein, der Code wird als String gespeichert und direkt in den Head Ihrer Website eingefügt.

Was passiert, wenn mein Skript einen Fehler verursacht?

Code, der bei Cookie-Zustimmung ausgeführt wird, ist in einen try-catch-Block eingebettet. Fehler werden in der Browser-Konsole protokolliert, ohne das Laden der Seite zu verhindern.

Lestis kann nicht alle Fehlerfälle überwachen: Das Einfügen von Code erfolgt auf eigene Gefahr des Website-Besitzers.

Unterstützen Sie externe Skripte (src)?

Natürlich. Im Feld JS Head können Sie das klassische script-Tag einfügen <script src=".."></script>