Какова правильная конфигурация RTE для отображения моих собственных классов CSS в качестве выбора?

Конфигурация RTE меняется с каждой (большой) версией. Теперь у меня есть моя первая установка 7.6, где мне нужно настроить RTE, чтобы редакторы могли иметь специальные классы для абзацев, интервалов или таблиц.
например. редактор должен иметь возможность выбирать стили начальной загрузки по умолчанию для таблиц: table-striped, table-bordered

Я не использую старую конфигурацию из установки 6.2, а создал ее заново из документации.

Я использую расширение сайта и включаю TSconfig в ext_localconf.php с

\TYPO3\CMS\Core\Utility\ExtensionManagementUtility::addPageTSConfig(
    '<INCLUDE_TYPOSCRIPT: source="FILE:EXT:site_abc/Configuration/TSconfig/Page.txt">'
);

в этом Page.txt я использую

<INCLUDE_TYPOSCRIPT: source="FILE:EXT:site_abc/Configuration/TSconfig/rte.ts">

включить мою специальную конфигурацию rte.

КАК рабочая конфигурация показанных кнопок (также используется css-файл) Интересно, почему отсутствует конфигурация доступных классов.

my rte.ts:

RTE {
    default {
        contentCSS.rte = EXT:site_abc/Resources/Public/Css/rte.css

        proc {
            allowTags = a, abbr, article, b, bdo, big, blockquote, br,
                 caption, center, cite, code, div, em, footer, header,
                 h2, h3, h4, h5, h6, hr, i, li, link, nav, ol, p, pre,
                 section, small, span, strike, strong, sub, sup, table,
                 thead, tbody, tfoot, td, th, tr, u, ul

            allowedClasses := addToList(table-striped,table-bordered,table-condensed)
            allowedClasses := addToList(abc-red,abc-green)
        }

        showButtons (
          blockstylelabel, blockstyle, textstylelabel, textstyle, fontstyle, fontsize, 
          formatblock, blockquote, left, center, right, justifyfull, orderedlist, unorderedlist, 
          definitionlist, definitionitem, outdent, indent, formattext, bidioverride, big, 
          bold, italic, subscript, superscript, underline, textcolor, bgcolor, textindicator, 
          insertcharacter, insertsofthyphen, line, link, unlink, image, table, findreplace, 
          spellcheck, chMode, inserttag, removeformat, copy, cut, paste, pastetoggle, pastebehaviour, 
          undo, redo, about, toggleborders, tableproperties, tablerestyle, rowproperties, 
          rowinsertabove, rowinsertunder, rowdelete, rowsplit, columnproperties, 
          columninsertbefore, columninsertafter, columndelete, columnsplit, cellproperties, 
          cellinsertbefore, cellinsertafter, celldelete, cellsplit, cellmerge
        )

        toolbarOrder (
            copy, cut, paste, pastetoggle, pastebehaviour, bar,
            undo, redo, bar, chMode, removeformat, bar,
            findreplace, spellcheck, bar,
            textcolor, bgcolor, textindicator, bar,
            editelement, insertcharacter, insertsofthyphen, line, image, abbreviation, bar,
            link, unlink, bold, italic, subscript, superscript, underline, bar, linebreak,
            blockstylelabel, blockstyle, space, formatblock, bar,
            orderedlist, unorderedlist, outdent, indent, bar,
            textstylelabel, textstyle, space, formattext, space, fontstyle, space, fontsize, bar,
            left, center, right, justifyfull, bar, linebreak,
            table, toggleborders, bar,
            tableproperties, tablerestyle, bar,
            rowproperties, rowinsertabove, rowinsertunder, rowdelete, rowsplit, bar,
            columnproperties, columninsertbefore, columninsertafter, columndelete, columnsplit, bar,
            cellproperties, cellinsertbefore, cellinsertafter, celldelete, cellsplit, cellmerge
        )
    }
    buttons {
        blockstyle {
            tags {
                all.allowedClasses := addToList(table-striped,table-bordered)
                table.allowedClasses := addToList(table-striped,table-bordered)
            }
            showTagFreeClasses = 1
        }

        textstyle {
            tags.all.allowedClasses := addToList(abc-red,abc-green)
            tags.span.allowedClasses = abc-red, abc-green
            showTagFreeClasses = 1
        }
    }

    classes {
        test1 {
            name = test1
            value = background-color:red;
        }

        table-striped {
            name = striped table
            value = background-color:#eeffee;
        }

        table-bordered {
            name = bordered table
            value = background-color:#ffeeee;
        }

        abc-red {
            name = red
            value = #CC1111
        }

        abc-green {
            name = green
            value = #11cc11
        }
    }

    colors {
        abc-red {
            name = red
            value = #CC1111
        }

        abc-green {
            name = green
            value = #11cc11
        }
    }

    default.colors < .colors
    default.classes < .classes
}

и rte.css:

table.table-striped { border:1px solid red; }
table.table-bordered { border: 1px dashed cyan; }
table.table-condensed { border: 1px dotted greenyellow; }

span.abc-red { color:#cc1111; }
span.abc-green { color:#11cc11; }

.table-striped { border:1px solid red; }
.table-bordered { border: 1px dashed cyan; }
.table-condensed { border: 1px dotted greenyellow; }

.abc-red { color:#cc1111; }
.abc-green { color:#11CC11; }

person Bernd Wilke πφ    schedule 30.11.2016    source источник


Ответы (2)


Вот файл конфигурации, который я использую в своем шаблоне t3bootstrap.de.

RTE.classes {
    # lists
    checklist {
        name = Checkliste
    }

    # tables
    table {
        name = Normale Tabelle
    }

    table-condensed {
        name = Verkürzte Tabelle
    }

    table-bordered {
        name = Tabelle mit Rahmen
    }

    table-styled {
        name = Tabelle mit anderem Design
    }

    # aligns
    align-justify {
        name = LLL:EXT:rtehtmlarea/Resources/Private/Language/locallang_tooltips.xlf:justifyfull
    }

    align-left {
        name = LLL:EXT:rtehtmlarea/Resources/Private/Language/locallang_tooltips.xlf:justifyleft
        value = text-align: left;
    }

    align-center {
        name = LLL:EXT:rtehtmlarea/Resources/Private/Language/locallang_tooltips.xlf:justifycenter
        value = text-align: center;
    }

    align-right {
        name = LLL:EXT:rtehtmlarea/Resources/Private/Language/locallang_tooltips.xlf:justifyright
        value = text-align: right;
    }

    text-lowercase {
        name = Kleinbuchstaben
    }

    text-uppercase {
        name = Großbuchstaben
    }

    style1 {
        name = Stil 1
    }

    htmlCode {
        name = HTML Code
    }

    phpCode {
        name = PHP Code
    }
}

RTE.classesAnchor {
    internalLinkInNewWindow {
        class = internal-link-new-window
        type = page
        titleText = LLL:EXT:rtehtmlarea/res/accessibilityicons/locallang.xml:internal_link_new_window_titleText
    }

    download {
        class = download
        type = file
        titleText = LLL:EXT:rtehtmlarea/res/accessibilityicons/locallang.xml:download_titleText
    }

    mail {
        class = mail
        type = mail
        titleText = LLL:EXT:rtehtmlarea/res/accessibilityicons/locallang.xml:mail_titleText
    }

    more-link {
        class = more-link
        type = page
        titleText = LLL:EXT:demotemplate/Resources/Private/Language/locallang.xml:more_link_titleText
        altText = LLL:EXT:demotemplate/Resources/Private/Language/locallang.xml:more_link_altText
    }

    button-link {
        class = btn
        type = page
        titleText = LLL:EXT:demotemplate/Resources/Private/Language/locallang.xml:more_link_titleText
        altText = LLL:EXT:demotemplate/Resources/Private/Language/locallang.xml:more_link_altText
    }

}

RTE.default {
    showButtons = blockstylelabel, blockstyle, textstylelabel, textstyle, left, center, right, justifyfull
    showButtons := addToList(formatblock, bold, italic, subscript, superscript)
    showButtons := addToList(orderedlist, unorderedlist, outdent, indent, textindicator,abbreviation)
    showButtons := addToList(insertcharacter, link, unlink, table, findreplace, chMode, removeformat, copy, cut, paste, pastetoggle, pastebehaviour, undo, redo)
    showButtons := addToList(toggleborders, tableproperties)
    showButtons := addToList(rowproperties, rowinsertabove, rowinsertunder, rowdelete, rowsplit)
    showButtons := addToList(columninsertbefore, columninsertafter, columndelete, columnsplit)
    showButtons := addToList(cellproperties, cellinsertbefore, cellinsertafter, celldelete, cellsplit, cellmerge)

    defaultContentLanguage = de

    buttons.textstyle.tags.span.allowedClasses = label,label-default,label-primary,label-danger,label-success,label-info,label-warning,important,detail,underline,mono,file,directory,oneclass
    buttons.textstyle.tags.REInlineTags >
    buttons.textstyle.REInlineTags >
    buttons.blockstyle.tags.table.allowedClasses = table,table-condensed,table-bordered,table-striped
    buttons.blockstyle.tags.p.allowedClasses = text-muted,text-primary,text-dimmed,text-warning,text-danger,text-success,text-info,bg-primary,bg-success,bg-info,bg-warning,bg-danger,box
    buttons.blockstyle.tags.p.allowedClasses := addToList(align-left,align-center,align-right,align-justify)
    buttons.blockstyle.tags.p.allowedClasses := addToList(text-capitalize,text-uppercase,text-lowercase)

    contentCSS = EXT:demotemplate/Resources/Public/CSS/rte.css

    buttons.link.relAttribute.enabled = 1

    // Make rtehtmlarea resizable
    rteResize = 1

    proc {
        allowedClasses := addToList( table,table-condensed,table-bordered,table-striped,table-hover,table-styled )
        allowedClasses := addToList( text-uppercase,text-lowercase,text-capitalize,text-muted,text-primary,text-dimmed,text-warning,text-danger,text-success,text-info,bg-primary,bg-success,bg-info,bg-warning,bg-danger )

        allowTagsOutside := addToList( pre )

        allowTags := addToList( pre )

        // Tags allowed in Typolists
        allowTagsInTypolists = br,font,b,i,u,a,img,span

        // Keep unknown tags
        dontRemoveUnknownTags_db = 1

        // Allow tables
        preserveTables = 1

        entryHTMLparser_db = 1
        entryHTMLparser_db {
            // Tags allowed
            allowTags < RTE.default.proc.allowTags

            // Tags denied
            #denyTags >

            // HTML special characters
            htmlSpecialChars = 0

            // Allow IMG tags
            #tags.img >

            // Additionnal attributes for P & DIV
            tags.div.allowedAttribs = class,style,align
            tags.p.allowedAttribs = class,style,align

            // Tags to remove
            removeTags = center, font, o:p, sdfield, strike, u

            // Keep non matched tags
            keepNonMatchedTags = protect
        }

        // HTML parser
        HTMLparser_db {
            // Strip attributes
            noAttrib = br

            // XHTML compliance
            xhtml_cleaning = 1
        }

        // Exit HTML parser
        exitHTMLparser_db = 1
        exitHTMLparser_db {
            // Remap bold and italic
            tags.b.remap = strong
            tags.i.remap = em

            // Keep non matched tags
            keepNonMatchedTags = 1

            // HTML special character
            htmlSpecialChars = 0
        }
    }
}

RTE.default.FE < RTE.default
person Sven Wappler    schedule 01.12.2016

Вы можете найти пример здесь. Насколько я помню, этот читает классы из данного файла css.

https://github.com/Ecodev/speciality/blob/master/Configuration/PageTS/rte.txt#L101

contentCSS = EXT:speciality/Resources/Public/StyleSheets/rte.css

Надеюсь, поможет.

person randomresult    schedule 01.12.2016