Search code examples
objectwysiwygpimcore

Wysiwyg in pimcore object?

I have problem with wysiwyg editor in pimcore object. When I mark text, go to Styles and choose for example "Marker" that results nothing. In source code that looks like < span class="marker" > Lorem ipsum < /span >, but in editor it's same. It only gets text, althought text should be yellow.

Any ideas ?

Solution

  • The Styles dropdown actually just changes the HTML markup. So this

    <p>Lorem ipsum</p>

    is changed into

    <p><span class="marker">Lorem ipsum</span></p>

    If you really want to have yellow text, then you need to add something like this to your frontend css:

    .marker {
     background-color: yellow;
}

    There is a Source button (last one in the WYSIWYG field toolbar) that let's you examine what markup is actually being produced, so you can build the needed CSS classes.

    On the other hand the objects WYSIWYG doesn't know anything about your frontend CSS. The contentsCSS CKEditor option doesn't seem to work, so the fastest workaround would be to create a new Pimcore extension and put into its CSS file something like this:

    .pimcore_tag_wysiwyg .marker {
    background-color: yellow;
}