Der Benutzerdefinierter HTML-Block ermöglicht es Ihnen, beliebige HTML-Markup direkt auf Ihren SeedProd-Seiten einzubetten. Egal, ob Sie ein Widget von Drittanbietern, einen benutzerdefinierten Einbettungscode, rohen HTML-Output oder einen beliebigen Ausschnitt hinzufügen müssen, für den SeedProd keinen dedizierten Block hat, dieser Block bietet Ihnen eine direkte Möglichkeit, ihn einzufügen.
Dies macht ihn ideal für die Integration externer Tools, benutzerdefinierter Skripte oder beliebiger HTML-basierter Inhalte, die Sie präzise in Ihr Seitenlayout einfügen möchten.
Hinzufügen des benutzerdefinierten HTML-Blocks zu Ihren Seiten
Befolgen Sie diese Schritte, um einen benutzerdefinierten HTML-Block zu Ihrer SeedProd-Seite hinzuzufügen:
Schritt 1: Block hinzufügen
Ziehen Sie unter Design > Blöcke den Block Benutzerdefinierter HTML in den gewünschten Bereich Ihrer Seite.
Ziehen Sie den benutzerdefinierten HTML-Block aus dem Blöcke-Panel und legen Sie ihn in den gewünschten Seitenbereich.
Schritt 2: Inhaltseinstellungen konfigurieren
Nach dem Hinzufügen klicken Sie auf den benutzerdefinierten HTML-Block, um seine Einstellungen zu öffnen. Im Tab Inhalt können Sie Ihren HTML-Code eingeben und auf den Vollbild-Editor zugreifen.
- Benutzerdefinierter Code: Fügen Sie Ihr HTML-Markup direkt in den Textbereich ein oder tippen Sie es ein. Dies kann jedes gültige HTML sein, einschließlich Einbettungscodes, Iframes, benutzerdefinierter Elemente oder Skript-Tags.
- Editor erweitern: Klicken Sie auf diese Schaltfläche, um einen größeren Vollbild-Code-Editor zu öffnen, der die Arbeit mit längeren oder komplexeren HTML-Snippets erleichtert.
Geben Sie Ihren HTML-Code im Tab Inhalt ein. Verwenden Sie die Schaltfläche Editor erweitern für einen größeren Bearbeitungsbereich.
Schritt 3: Design anpassen
Im Tab Erweitert können Sie das Layout und die Sichtbarkeit Ihres benutzerdefinierten HTML-Blocks steuern.
Abstand:
- Abstand außen: Steuern Sie den äußeren Abstand um Ihren benutzerdefinierten HTML-Block (Oben, Rechts, Unten, Links). Dies bestimmt, wie viel Platz zwischen dem Block und den umgebenden Elementen vorhanden ist.
- Abstand innen: Passen Sie den inneren Abstand innerhalb Ihres benutzerdefinierten HTML-Blocks an (Oben, Rechts, Unten, Links). Dies schafft Freiraum zwischen Ihrem HTML-Inhalt und den Blockrändern.
Attribute:
- CSS-ID: Zeigt die automatisch generierte eindeutige Kennung für Ihren benutzerdefinierten HTML-Block an. Diese ID wird von SeedProd automatisch für benutzerdefinierte Stile oder JavaScript-Ziele erstellt.
- Benutzerdefinierte Klasse: Fügen Sie benutzerdefinierte CSS-Klassen hinzu, um bestimmte Stile aus Ihrem Theme oder benutzerdefinierten CSS anzuwenden.
- Benutzerdefinierte Attribute: Fügen Sie dem Block-Wrapper-Element beliebige HTML-Attribute hinzu. Geben Sie jedes Attribut in eine neue Zeile im Format ein: attribut-name|wert (z. B. data-section|html-embed)
Gerätesichtbarkeit:
- Auf Desktop ausblenden: Blenden Sie den benutzerdefinierten HTML-Block auf Desktop-Bildschirmen aus.
- Auf Tablet ausblenden: Blenden Sie den benutzerdefinierten HTML-Block auf Tablet-Geräten aus.
- Auf Mobilgeräten ausblenden: Blenden Sie den benutzerdefinierten HTML-Block auf Mobilgeräten aus.
Animationseffekte:
- Eingangs-Animation: Wählen Sie aus verschiedenen Animationseffekten, die abgespielt werden, wenn der benutzerdefinierte HTML-Block ins Sichtfeld scrollt. Optionen umfassen Bounce, Fade In, Zoom In, Rotate In und viele mehr.
Verwenden Sie den Tab Erweitert, um Abstände, Attribute, Geräte-Sichtbarkeit und Eingangs-Animationen für Ihren benutzerdefinierten HTML-Block zu steuern.
Schritt 4: Speichern Sie Ihre Änderungen
Sobald Sie die Konfiguration des Custom HTML-Blocks abgeschlossen haben, stellen Sie sicher, dass Sie Ihre Arbeit speichern.
Sie haben erfolgreich einen Custom HTML-Block zu Ihrer Seite hinzugefügt! Egal, ob Sie ein Widget von Drittanbietern, ein benutzerdefiniertes Formular oder einen beliebigen HTML-Snippet einbetten, den Ihre Website benötigt, der Custom HTML-Block bietet Ihnen die Flexibilität, jedes Markup genau dort zu platzieren, wo Sie es auf Ihren SeedProd-Seiten wünschen.