TYPO3 Agency - coding, design and website development

Rich Text Editor: Nastavenie ovládacích prvkov

V článku opíšeme niektoré nastavenie Rich Text Editora (RTE), ktorý je najpoužívanejším modulom na správu obsahu v backende TYPO3. Ukážeme si, ako zredukovať, resp. usporiadať množstvo ovládacích prvkov, ktoré tento modul poskytuje na úpravu textu.

Požiadavky:

Typo3 4.7.17
Modul rtehtmlarea 4.7.7
Nastavenie rtehtmlarea "Default configuration settings": Typical
Prehliadač: Firefox

Nastavenia budú z veľkej miery fungovať aj na iných verziách rtehtmlarea, ale pre istotu uvádzame túto našu konfiguráciu - jeden človek nikdy nevie (po predošlých skúsenostiach).

Štandardné nastavenie - Typical

Takto to bude vyzerať v TYPO3 backend-e:

Štandardne nastavenie rtehtmlarea - Typical

Vlastná "minimalizácia" ovládacích prvkov

Vo veľa prípadoch (na jednoduchších weboch) máme požiadavku na redukciu ovládacích prvkov RTE. Je to hlavne kvôli tomu, že niektorí užívatelia sa nevedie "udržať na uzde" pri používaní všetkých vymožeností a samotný obsah stránky potom vyzerá, ako keď dieťa prvý krát dostane do ruky počítač s Word-om. Dokážu v jednoduchom texte použiť všetky štýly formátovania, ktoré im program ponúkne. A tomu sa snažíme, v rámci možností, zabrániť.

Pozrite si nastavenie Page TS Config pre rtehtmlarea >

Takto potom vyzerá editor:

Minimalizácia ovládacích prvkov RTE

Page TS Config

Z našich nastavení uvedieme podstatnú časť:

RTE.default {
# zoznam povolených ovládacích prvkov - všetky
showButtons = *
# zoznam skrytých ovládacích prvkov
hideButtons (
blockstylelabel, blockstyle, textstylelabel, textstyle, fontstyle, fontsize, formatblock, blockquote,
insertparagraphbefore, insertparagraphafter, lefttoright, righttoleft,
language, showlanguagemarks,
orderedlist, unorderedlist, definitionlist, definitionitem, outdent, indent,
formattext, bidioverride, big, citation, code, definition, deletedtext, emphasis, insertedtext,
keyboard, monospaced, quotation, sample, small, span, strikethrough, subscript, superscript, underline, variable,
textcolor, bgcolor, textindicator, editelement, showmicrodata, emoticon, insertcharacter, insertsofthyphen, line,
image, table, user, acronym, findreplace, spellcheck, inserttag, removeformat, pastetoggle, pastebehaviour,
about,
toggleborders, tableproperties, tablerestyle,
rowproperties, rowinsertabove, rowinsertunder, rowdelete, rowsplit,
columnproperties, columninsertbefore, columninsertafter, columndelete, columnsplit,
cellproperties, cellinsertbefore, cellinsertafter, celldelete, cellsplit, cellmerge
)
# poradie a oddeľovače (bar) ovl. prvkov
toolbarOrder (
bold, italic, bar,
left, center, right, justifyfull, bar,
link, unlink, bar,
chMode, bar,
copy, cut, paste, bar,
undo, redo, bar
)
}

Popis vybraných ovládacích prvkov

TlačidláNázovPopis
bold, italictučné a šikmé písmo
left, center, right, justifyfullzarovanie textu
link, unlinkvloženie a úprava odkazu v texte
chModezmena na HTML mód
copy, cut, pastekopírovanie obsahu
undo, redokrok späť, vrátiť zmenu

Kompletný zoznam ovládacích prvkov RTE >

Poznámka: Možno sa čudujete, na začiatku sme chceli minimalizovať ovládanie užívateľom a nakoniec mu povolíme HTML mód, kde môže robiť, čo sa  mu zachce. No, nie je to tak celkom pravda:

  1. RTE sa dá nastaviť, aby filtroval, čo tam nepatrí (ale k tomu sa dostaneme v niektorom ďalšom článku),
  2. tento mód má slúžiť na prípadné ručné opravy kódu vkladaného napr. z Word-u, s ktorými si RTE nevie poradiť (rôzne formátovanie a pod.)
  3. a keďže to už vieme nastaviť, môžeme ho kedykoľvek zakázať (pridať chMode do položky hideButtons).