HTML-Komponente (Plain HTML)

Diese Komponente hat nur ein einziges Feld, und genau darin liegt ihre Stärke: Sie schreiben HTML hinein, und die Expo-IP setzt es unverändert auf den Stand. Damit lässt sich alles darstellen, wofür es keine eigene Komponente gibt, von einer schlichten Hinweisbox bis zu einem eingebundenen Werkzeug eines anderen Anbieters.

Im Auswahlfeld „Komponententyp" heißt die Komponente Plain HTML.

Anlegen, Platzieren, Größe ändern, Verzerren und Speichern funktionieren wie bei allen Komponenten. Die Schritte sind am Beispiel der Bild-Komponente (Image) beschrieben. Die Reiter „Layout", „Sichtbarkeit" und „Generiert" beschreibt die Seite Einstellung von Layout und Sichtbarkeit.

cb-plainhtml-komponente.png
Die HTML-Komponente im Stand-Editor mit einem einfachen Beispiel

Das Feld

Abschnitt Feld Bedeutung
HTML HTML-Inhalt Der HTML-Code, der auf dem Stand erscheint. Er wird unverändert übernommen.

Anders als bei den übrigen Komponenten wird Ihre Eingabe nicht laufend übernommen, sondern erst, wenn Sie auf Übernehmen klicken. Das hat einen guten Grund: Während des Tippens ist HTML zwangsläufig unvollständig, und ein halb geschriebenes Element würde die Darstellung der Szene durcheinanderbringen. Schreiben Sie also in Ruhe zu Ende und klicken Sie dann auf „Übernehmen".

Ein einfaches Beispiel, wie im Bild oben:

<div style="border: 3px solid red; color: red;">
<p>Das ist ein wichtiger Hinweis</p>
</div>

Was mit HTML möglich ist

Alles, was ein Browser darstellen kann, lässt sich hier einsetzen: Überschriften, Absätze, Listen, Tabellen, Bilder, Links, eigene Farben und Abstände über style-Angaben. Damit deckt die Komponente die Fälle ab, für die es keinen eigenen Komponententyp gibt, zum Beispiel:

  • eine Preistabelle,
  • einen Hinweiskasten in Ihren Unternehmensfarben,
  • eine Auflistung technischer Daten,
  • ein Zitat oder ein Kundenurteil in eigener Gestaltung,
  • ein Zählwerk („noch 3 Tage bis zum Vortrag"), sofern Sie den Text von Hand pflegen.

Fremde Werkzeuge einbinden

Über HTML lassen sich auch Dienste anderer Anbieter auf den Stand holen, etwa ein Chat-Werkzeug, ein Buchungskalender, ein Konferenzraum oder ein Umfrage-Werkzeug. Dabei ist eine Eigenheit der Plattform entscheidend, die Sie kennen müssen, bevor Sie loslegen.

Eingebettete <script>-Blöcke werden nicht ausgeführt

Die meisten Anbieter geben Ihnen einen Einbettungscode, der aus einem <script>-Element besteht, oft in der Form <script src="https://anbieter.example/widget.js"></script>. Dieser Weg funktioniert in der HTML-Komponente nicht. Der Code wird zwar gespeichert und steht auch in der Seite, aber der Browser führt Skripte nicht aus, die auf diese Weise nachträglich eingefügt werden. Das ist kein Fehler der Expo-IP, sondern eine Festlegung der Browser selbst.

Was stattdessen funktioniert:

  • Einbettung als iframe. Viele Anbieter bieten neben dem Skript auch eine Einbettung über <iframe src="…"> an. Diese läuft problemlos. Bequemer geht es mit der Webseiten-Komponente (Embedded Webpage), die genau dafür da ist und zusätzlich Berechtigungen, Sandbox und Referrer-Richtlinie einstellbar macht. Für eingebettete Fremdseiten ist sie die bessere Wahl.
  • Verlinken statt einbetten. Wo ein Anbieter keine iframe-Einbettung erlaubt, führt ein Link zum Ziel, wahlweise über die Link-Komponente (Link) mit Rückfrage vor dem Verlassen der Plattform.

JavaScript direkt am Element

Ereignisse, die direkt an einem Element hängen, werden dagegen ausgeführt, zum Beispiel:

<button onclick="alert('Danke für Ihr Interesse!')">Mehr erfahren</button>

Damit sind kleine Interaktionen möglich. Für alles Größere ist dieser Weg allerdings mühsam und schlecht zu pflegen, weil sich der gesamte Code in Attributen verstecken muss.

Für die ganze Messe geht es anders. Veranstalter können in den Grundeinstellungen unter „Benutzerdefiniertes CSS/JS" eigenes JavaScript hinterlegen, das auf allen Seiten der Messe läuft. Das ist der richtige Ort für Dinge, die überall gelten sollen, etwa ein Analysewerkzeug. Für einen einzelnen Stand steht diese Möglichkeit nicht zur Verfügung. Überlegen Sie in solchen Fällen, ob nicht eine der fertigen Komponenten die Aufgabe besser löst, etwa die Formular-Komponente (Form) für Eingaben oder der KI-Assistent (AI Assistant) für ein Gespräch.

Datenschutz: Was Sie hier einbetten, wird beim Öffnen des Standes geladen, ohne dass Besucher vorher gefragt werden. Ein eingebundener Dienst erfährt dadurch die IP-Adresse jedes Besuchers und kann eigene Cookies setzen. Betten Sie deshalb nur Dienste ein, deren Datenverarbeitung Sie kennen und in Ihrer Datenschutzerklärung nennen.

Eine andere Komponente als Vorlage nehmen

Es gibt einen bequemen Weg zu gutem HTML, der oft übersehen wird: Lassen Sie die Expo-IP den Code schreiben und passen Sie ihn an.

  1. Legen Sie eine Komponente des gewünschten Typs an, zum Beispiel eine Bild-Komponente, und füllen Sie sie wie gewohnt aus.
  2. Öffnen Sie den Reiter Generiert. Dort steht der fertige HTML-Code dieser Komponente.
  3. Kopieren Sie ihn in eine HTML-Komponente und ändern Sie dort, was Sie brauchen, etwa zusätzliche Texte, eine andere Anordnung oder eigene Farben.
  4. Die ursprüngliche Komponente können Sie danach löschen oder im Reiter „Sichtbarkeit" ausblenden.

So bekommen Sie eine Vorlage, die zum Aussehen der übrigen Komponenten passt, samt der Klassennamen, die das Aussehen der Messe mitbringt. Den Reiter „Generiert" beschreibt die Seite Einstellung von Layout und Sichtbarkeit.

Zwei Einschränkungen sollten Sie dabei kennen:

  • Kopierter Code wird nicht mitgepflegt. Ändert sich die Expo-IP in einer neuen Version, wachsen die echten Komponenten mit, Ihre Kopie nicht. Prüfen Sie kopierte Bausteine nach einem Update.
  • Was auf Daten beruht, bleibt leer. Komponenten wie Konferenzen, Hallenübersicht oder Dokumente holen ihren Inhalt erst beim Anzeigen von der Messe. Ihr generiertes HTML ist deshalb nur eine leere Hülle, und eine Kopie davon bleibt leer. Für diese Fälle nehmen Sie die richtige Komponente.

Worauf Sie achten sollten

  • Es gibt kein Sicherheitsnetz. Ihr HTML wird weder geprüft noch korrigiert. Ein fehlendes schließendes Element kann die Darstellung des Standes stören. Klicken Sie nach jeder Änderung auf „Übernehmen" und sehen Sie sich das Ergebnis in der Szene an.
  • Keine festen Breiten in Pixeln. Die Szene wird beim Anzeigen auf die Bildschirmbreite des Besuchers gerechnet. Angaben in Prozent oder max-width vertragen sich damit besser als eine feste Breite.
  • Bilder gehören in den Medienmanager. Binden Sie Bilder über deren Adresse aus dem Medienmanager ein, nicht von fremden Servern. Dann bleiben sie erreichbar, auch wenn sich anderswo etwas ändert.
  • Denken Sie an Alternativtexte und Kontraste. Was die fertigen Komponenten Ihnen abnehmen, müssen Sie hier selbst mitbringen: ein alt an jedem Bild und ausreichend Kontrast zwischen Schrift und Hintergrund.
  • Im Zweifel die fertige Komponente. Bild, Video, Formular oder Kontakt bringen Barrierefreiheit, Zählung der Aufrufe und einheitliches Aussehen mit. Die HTML-Komponente ist für das gedacht, was übrig bleibt.

Ausprobieren

Im Editor-Modus sehen Sie Ihr HTML bereits, aber es reagiert nicht auf Klicks. Für Links, Knöpfe und eingebettete Inhalte wechseln Sie in die Vorschau, wie auf der Seite Video-Komponente (Video) im Abschnitt „Editor-Modus und Vorschau" beschrieben.

In der Liste unter dem Stand erscheint die HTML-Komponente nicht automatisch, denn ob ein freier HTML-Block dort sinnvoll ist, hängt vom Inhalt ab. Wenn Sie ihn dort zeigen möchten, setzen Sie im Reiter „Sichtbarkeit" den Haken „In Liste anzeigen"; die Überschrift lautet dann „Information".