Iframe Tag für Youtube Videos im CKEditor unter TYPO3 8.7.x einrichten

Meiner Meinung nach ist es super praktisch Youtube Videos mit in die normalen Contentelemente einbauen zu können, so sparst du Contentelemente, schonst deine Webseiten Performance und es ist darüberhinaus auch noch übersichtlicher. Außerdem ist es auch so möglich, Videos in den Newsbeiträgen mit einzubauen. Hier findest du eine Erklärung für ein aktuelles TYPO3 8.7.x unter der Verwendung des CKEditors.

Du kannst das Youtube Plugin auf der Seite von CKEditor herunterladen. Lege das Paket in deine Extension oder in der rte_ckeditor Extension im Core ab. (Dies ist jedoch keine saubere Lösung. 😉 ) Nun bearbeitest du deine Haupt YAML Datei. Da das Paket nicht im Standard Plugin Ordner liegt wird es mit externalPlugins eingebunden. Dieser Parameter darf nicht in der config Ebene stehen, sondern direkt unter editor. Es reicht die Angabe des Pfades mit resource: EXT:my_ext, diese wird im rte_ckeditor dann in den korrekten Pfad umgewandelt.

config.youtube_width: '550'
externalPlugins:
youtube: { resource: "EXT:my_ext/Resources/Public/JavaScript/Ckeditor/Plugins/youtube/" }

Für das RTE Prozessing muss in der YAML Datei folgendes hinzugefügt werden, dieser Einstellung erlaubt iframe Tags in deinem Textfeld, ansonsten werden alle Iframe beim Speichern entfernt.

processing:
allowTags:
- iframe

Zusätzlich gibst du per Typoscript den Tag Iframe frei. Dazu ergänzt du folgende Zeile unter den Constants in deinem TYPO3 Template.

styles.content.allowTags:= addToList(iframe)

Bei meiner Installation TYPO3 8.7.9 funktionierte alles im Backend problemlos, nur im Fronend wurde der Iframe als Quellcode komplett ausgeben. Durch das hinzufügen dieser Einstellung unter Setup im TYPO3 Template wurde das HTML (Iframe Tag) gerendert und das Video ausgegeben und somit dargestellt.

lib.parseFunc_RTE.externalBlocks = iframe

MerkenMerken

MerkenMerken

MerkenMerken

MerkenMerken

2 Gedanken zu „Iframe Tag für Youtube Videos im CKEditor unter TYPO3 8.7.x einrichten“

  1. Hallo Felix,

    vielen Dank für diese einfache Anleitung. Damit habe ich es hinbekommen in Typo3 8.7 die iframes anzuzeigen. Das einzige was noch stört ist, dass p-Tags um den iframe gelegt werden.
    Nun versuche ich ein Update auf Typo3 9.5 und dann werden wieder die iframes als Quellcode ausgegeben. Hat sich da was geändert wie man das verhindert. Wie sieht es in Typo3 10 aus? Geht das dann noch?

    1. Hey Jürgen,

      leider habe ich bisher kein Update auf diese Versionen durchgeführt und habe damit noch keine Erfahrung.
      Jedoch wäre nun meine erste Idee, ob die
      lib.parseFunc_RTE.externalBlocks = iframe möglicherweise nicht mehr geht oder vielleicht sogar überflüssig ist.

      lg Felix

Schreibe einen Kommentar

Deine E-Mail-Adresse wird nicht veröffentlicht. Erforderliche Felder sind mit * markiert