Allow oembed tag in ckeditor

Question

I want to put oembed tags into the ckeditor RTE of TYPO3. This way I want to put social post like instagram, facebook or twitter into some news article (in the middle of some text).

For this purpose I have activated the embed plugins of ckeditor and put the oembed tag under processing in allowedTags. I also defined the oembed tag in the constants for styles.content.allowTags.

Here my yaml:

imports:
    - { resource: "EXT:rte_ckeditor/Configuration/RTE/Processing.yaml" }
    - { resource: "EXT:rte_ckeditor/Configuration/RTE/Editor/Base.yaml" }
    - { resource: "EXT:rte_ckeditor/Configuration/RTE/Editor/Plugins.yaml" }

editor:
    config:
        contentsCss: "EXT:mysitepackage/Resources/Public/Css/rte.css"

        stylesSet:
            - { name: "Lead", element: "p", attributes: { 'class': 'lead' } }

        toolbarGroups:
            - { name: styles, groups: [ format, styles ] }
            - { name: basicstyles, groups: [ basicstyles ] }
            - { name: paragraph, groups: [ list, indent, blocks, align ] }
            - "/"
            - { name: links, groups: [ links ] }
            - { name: clipboard, groups: [ clipboard, cleanup, undo ] }
            - { name: editing, groups: [ spellchecker ] }
            - { name: insert, groups: [ insert ] }
            - { name: tools, groups: [ table, specialchar ] }
            - { name: document, groups: [ mode ] }

        format_tags: "p;h1;h2;h3;h4;h5;pre"

        justifyClasses:
            - text-left
            - text-center
            - text-right
            - text-justify

        extraPlugins:
            - justify
            - embedsemantic
            - autoembed

        removePlugins:
            - image

        removeButtons:
            - Anchor
            - Underline
            - Strike

        autoEmbedWidget: "embedsemantic"
        embed_provider: "https://my.iframely.instance/oembed?url={url}&callback={callback}"

        extraAllowedContent: '*(*)[data-*]; oembed'

processing:
    allowTags:
        - oembed

This row in the constants:

styles.content.allowTags := addToList(oembed)

I'm now able to put the oembed into the RTE and its displayed teaser of the social post. After saving the content the oembed tag is replaced by a p tag

What am I missing?

Reference

Can you provide an example of the html source in ckeditor before and after it is changed? – Jell

Before: <oembed>[URL OF POST]</oembed> after: <p>[URL OF POST]</p> – Sizzle

If it does not eat the processing settings in the YML, does it eat the regular TSconfig for RTE in addition? Like RTE.default.proc.allowTags = oembed – Ingrate

Answer 1

From my experience, if something gets replaced with something else (especially the p tag), chances are high it is related to the Advanced content filter.

I can't pinpoint the error in your config, but have you tried disabeling ACF completely? (see allowedContent)

allowedContent = true;
(and remove the extraAllowedContent)

If that works, don't leave it like that (see security best practices), but work your way through to find the correct setting.

Maybe explicitly add the wildcard attributes in the extraAllowedContent:

extraAllowedContent: '*(*)[data-*]; oembed(*){*}[*];'

Jell

Unfortunately that doesn't help. Maybe the TYPO3 CMS is filtering that out. – Sizzle