Po dodaniu dużego pola tekstowego do typu zasobu i ustawieniu wyglądu edytora tekstu z formatowaniem można utworzyć niestandardowy pasek narzędzi.
Pasek narzędzi jest wstępnie wypełniony standardowymi grupami i opcjami paska narzędzi (widoczny jest jego podgląd).
Aby dostosować pasek narzędzi, należy kliknąć na karcie JSON, po czym edytować konfigurację JSON, używając składni CKEditor. Zob. https://ckeditor.com/latest/samples/toolbarconfigurator/index.html#basic.
Pole "Duży tekst" obsługuje następujące grupy:
"style podstawowe" — ograniczone do: pogrubienie, kursywa, podkreślenie; https://ckeditor.com/cke4/addon/basicstyles
"style" — style czcionek; https://docs.ckeditor.com/ckeditor4/latest/guide/dev_styles.html
"kolory" — kolory tekstu i tła; https://docs.ckeditor.com/ckeditor4/latest/guide/dev_colorbutton.html
"cofnięcie" — cofa/ponawia w edytorze bieżące działanie
"łącza" — niestandardowa wtyczka dialogowego okna łącza
"akapit" — obsługa list wypunktowanych/numerowanych oraz wcięć
"lista"
"wcięcie"
"wyrównanie" — do lewej, do prawej, wyśrodkuj
"wstaw"
"obraz"
"tabela"
"czyszczenie" — usuwa wszystkie style z wybranego tekstu
Dodatkowo można używać wpisu separatora wierszy: "/"
Uwaga:
Jeśli w konfiguracji grupy (paska narzędzi) ustawiono dowolną inną wartość, to — przed utworzeniem paska narzędzi konstruktora serwisów — wartość ta zostanie usunięta. Nie można udostępnić "extraPlugins" (dodatkowych wtyczek). Obsługiwane są tylko konfiguracje "nazwa"/"grupa". Wszelkie wpisy "elementy" będą ignorowane.Jako właściwości można użyć: "toolbarGroups" i "removeButtons" albo "toolbar". Poniżej zostały umieszczone przykłady.
Przykład 2-1 Opcja 1: "toolbarGroups" i "removeButtons"
{ "toolbarGroups": [ {"name": "basicstyles"} , {"name": "styles"} , {"name": "colors"} , {"name": "clipboard"} , "/", {"name": "links"} , {"name": "insert"} , {"name": "paragraph","groups": ["list","indent"]} , {"name": "align"} , {"name": "undo"} , {"name": "cleanup"} , {"name": "mode"} , {"name": "tools"} ], "removeButtons": "Styles,Subscript,Superscript,Anchor,Blockquote,PasteFromWord,Copy,Cut" }
Przykład 2-2 Opcja 2: "toolbar"
{ "toolbar" = [ { "name":"basicstyles","items":["Bold","Italic","Underline","Strike","Subscript","Superscript","-","CopyFormatting","RemoveFormat"] } , { "name":"paragraph","items":["NumberedList","BulletedList","-","Outdent","Indent","-","Blockquote","CreateDiv","-","JustifyLeft","JustifyCenter","JustifyRight","JustifyBlock","-","BidiLtr","BidiRtl","Language"] } , { "name":"links","items":["Link","Unlink","Anchor"] } , { "name":"insert","items":["Image","Flash","Table","HorizontalRule","Smiley","SpecialChar","PageBreak","Iframe"] } , "/", { "name":"styles","items":["Styles","Format","Font","FontSize"] } , { "name":"colors","items":["TextColor","BGColor"] } , { "name":"tools","items":["Maximize","ShowBlocks"] } , { "name":"about","items":["About"] } ]}