PORTAL und PPS Knowledge Base

Verwendung von HTML- & BBCode-Tags bei Importen

Owned by
Sandra Kerner
Last updated: 2024-02-09 by
Kathrin Janka
3 min read

Um bei Importen (z. B. über die ) Inhalte anzulegen, die über reinen Text hinausgehen (z. B. Einbettungen), müssen die HTML- & BBCode-Tags genutzt werden. Diese werden auch vom PEIQ PORTAL verwendet und daher entsprechend korrekt verarbeitet.

Funktionalitäten der Content Tags

  • Textauszeichnungen über BBCode-Tags

  • Einfügen von externen Inhalten über Einbettungen

Inhaltsverzeichnis

Details

Textauszeichnungen müssen als HTML-Tag übergeben werden, für Einbettungen muss BBCode verwendet werden.

In den Inhaltsformularen der einzelnen Module ist eine direkte Eingabe von HTML-Tags aus Sicherheitsgründen nicht erlaubt. Stattdessen wird ein definiertes Set von BBCode-Tags unterstützt, mit denen Inhalte angereichert werden können. Weitere Infos siehe .

Ablage des BBCode-Textes in der Datenbank

Sobald ein Inhalt gespeichert und in die Datenbank übertragen wird, werden die eingegebenen BBCodes teilweise in HTML konvertiert, bevor der Text in der Datenbank abgelegt wird. Andere BBCodes werden beibehalten. Weitere Informationen finden sich hier:

Öffnet man den Inhalt im Editor, so werden die unterstützten HTML-Tags wieder als BBCode angezeigt, sodass diese ohne Probleme bearbeitet werden können.

Importierte HTML-Tags im Editor

Prinzipiell gibt es keine Filterung von HTML-Tags bei der Darstellung von Inhalten, sie werden direkt und ohne Escaping ausgegeben. Es ist also möglich, über die verschiedenen API- und Import-Funktionen beliebigen HTML-Code in das Portal einzuspielen.

Bearbeitet man aber im Editor einen solchen Inhalt, so werden die nicht unterstützten HTML-Tags in Entities umgewandelt und damit beim Speichern unbrauchbar gemacht.

Bei Importen müssen diese Besonderheiten berücksichtigt und die zu importierenden Inhalte entsprechend aufbereitet werden: Textauszeichnungen müssen als HTML-Tag übergeben werden, für Einbettungen muss BBCode oder HTML verwendet werden.

Textauszeichnungen

Textauszeichnungen müssen bei Importen als HTML-Tag übergeben werden. Sofern die unten aufgelistete Syntax eingehalten wurde, können die Inhalte im Editor normal bearbeitet werden.

Unterstützte HTML-Tags

Beschreibung

HTML-Tag beim Import

Anzeige im Editor

Beschreibung

HTML-Tag beim Import

Anzeige im Editor

Zwischenüberschrift

<h2>

[h2]

Fett

<b>

[b]

Kursiv

<i>

[i]

Unterstrichen

<u>)

[u]

Hochgestellt

<sup>

[sup]

Tiefgestellt

<sub>

[sub]

Ungeordnete Liste

 

<ul>

Beispiel:

<ul><li>Eins</li><li>Zwei</li><li>Drei</li></ul>

[list][*]

Beispiel:

[list][*]Eins[/*][*]Zwei[/*][*]Drei[/*][/list]

Geordnete Liste

<ol>

Beispiel:

<ol><li>Eins</li><li>Zwei</li><li>Drei</li></ol>

[list=1][*]

Beispiel:

Zitat

<quote> -Tag (HTML)

Beispiel:

[quote]

Beispiel:

Hyperlink

 

<a> -Tag (HTML)

Beispiel:

[url]

Beispiel:

Hyperlink, der in einem neuen Fenster öffnet.

<a> -Tag (HTML)

Beispiel:

[urlnt]

Beispiel:

Hinweise zu <a>-Tags

Über den Editor eingegebene Links werden beim Speichern des Inhalts direkt mit dem korrekten rel-Attribut versehen. Details finden sich hier:

Bei der oben beschriebenen Verarbeitungsweise handelt es sich jedoch um eine Funktion des Editors!

Bei zu importierenden Inhalten müssen die rel-Attribute mitgegeben werden. Hierbei ist zu berücksichtigen, dass die Reihenfolge der Attribute strikt eingehalten werden muss:

Beispiele:

Unterstützte Einbettungen

Einbettungen werden zum Einfügen von externen Inhalten verwendet (z. B. YouTube-Videos). Da es sich bei diesen Inhaltsformen oft um dynamisch generierte Codefragmente handelt, werden bei Einbettungen die BBCode-Tags nicht transformiert, sondern direkt in die Datenbank geschrieben. Bei der Darstellung der Inhalte im PORTAL wird dann zur Laufzeit der entsprechende Code eingefügt.

Folgende Tags werden für Einbettungen unterstützt:

  • [video] Einbettung von Videos. Unterstützt werden YouTube, Vimeo und APA. Innerhalb der Tags muss die URL des Videos stehen.

  • [map] Einbettung von iFrame-Karten. Unterstützt werden Google Maps, Google My Maps und OpenStreetMap. Innerhalb der Tags muss die iFrame-src-URL der Karte stehen.

  • [twitter] Einbindung eines Twitter-Posts.

  • [instagram] Einbindung eines Instagram-Posts.

  • [facebook] Einbindung eines Facebook-Posts.

  • [tumblr] Einbindung eines Tumblr-Posts.

Einbettungen von internen Inhalten

Ein Teil der Einbettungen von internen Inhalten müssen als Platzhalter-<div> importiert werden. Der Platzhalter wird erst beim Ausspielen durch den entsprechenden Embed-Code ersetzt. Ein anderer Teil der BBCodes wird als BBCode importiert. Auch in diesem Fall wird der BBCode-Platzhalter beim Ausspielen durch ein entsprechendes <div> ersetzt.

Beschreibung

Tag beim Import

Anzeige im Editor

Beschreibung

Tag beim Import

Anzeige im Editor

Ein am Beitrag hochgeladenes Bild, welches im Text des Beitrags eingebettet wurde.

Ein im Text eingebetteter Medienstream.

Eingebetteter Teaser auf einen Beitrag.

  • data-article-earticle-layout="default": Anzeige als normale Teaser-Card

  • data-article-earticle-layout="image-gallery": Anzeige als Bildergalerie-Teaser-Card

 

Eingebetteter Teaser auf einen Schnappschuss.

Eingebetteter Teaser auf eine Veranstaltung.

  • data-eventcalendar-eeventitem-layout="default": Anzeige als normale Teaser-Card

  • data-eventcalendar-eeventitem-layout="image-gallery": Anzeige als Bildergalerie-Teaser-Card

Eingebettete Aktion. Weitere Informationen zu Aktionen finden sich hier.

 

Markierung der Lesebeschränkung bei Premium-Inhalten

Die Markierung der Lesebeschränkung bei Premium-Inhalten muss als HTML-Tag importiert werden:

Beschreibung

Ablage in der Datenbank

Anzeige im Editor

Beschreibung

Ablage in der Datenbank

Anzeige im Editor

Markierung der Lesebeschränkung bei Premium-Inhalten. Weitere Informationen zur Lesebeschränkung finden sich hier.

 

 

Exporte

Das Verhalten bei Exporten ist hier beschrieben:

 

Verwandte Seiten

 

Impressum