Die CKEditor Toolbar anpassen

Hier finden sich ein paar Hinweise wie die Toolbar des CKEditors individuell angepasst werden kann.

Die Datei die für die Einstellungen der Toolbar verantwortlich ist bzw. welche bearbeitet werden muss ist die config.js im Hauptverzeichnis des Editors. 

Meistens ist die Datei mit folgendem Inhalt befüllt:

/**
* @license Copyright (c) 2003-2013, CKSource - Frederico Knabben. All rights reserved.
* For licensing, see LICENSE.html or http://ckeditor.com/license
*/
CKEDITOR.editorConfig = function( config ) {
 // Define changes to default configuration here. For example:
// config.language = 'fr';
// config.uiColor = '#AADC6E';
};

In den meisten Fällen möchte man aus dem Editor einige nicht benötigte Funktionen entfernen hierzu wird die config.js des CKEditors um folgenden Befehl erweitert: "config.removeButtons".

Das Ergebnis könnte dann wie folgt aussehen: 

/**
* @license Copyright (c) 2003-2013, CKSource - Frederico Knabben. All rights reserved.
* For licensing, see LICENSE.html or http://ckeditor.com/license
*/
CKEDITOR.editorConfig = function( config ) {
// Define changes to default configuration here. For example:
// config.language = 'fr';
// config.uiColor = '#AADC6E';
config.removeButtons = 'TextColor,BGColor,Styles,Copy,Iframe,Flash,Smiley,PageBreak,Font,FontSize,Save,Print,NewPage,Preview,Templates,';
};

Toolbarbuttons im CKEditor

Die einzelnen Bestandteile der Toolbar sind folgende:

  1. "Source" = Ermöglicht die Anzeige des Quellcodes
  2. "Save" = der Sichern Button 
  3. "NewPage" = Einfügen einer neuen Seite
  4. "DocProps"
  5. "Preview" = Öffnet die Vorschau
  6. "Print" = ermöglicht das Ausdrucken des Textes
  7. "Templates" = Öffnet die Vorlagen
  8. "document"
  9. "Cut"
  10. "Copy"
  11. "Paste"
  12. "PasteText"
  13. "PasteFromWord"
  14. "Undo"
  15. "Redo"
  16. "Find"
  17. "Replace"
  18. "SelectAll"
  19. "Scayt"
  20. "Form"
  21. "Checkbox"
  22. "Radio"
  23. "TextField"
  24. "Textarea"
  25. "Select"
  26. "Button"
  27. "ImageButton"
  28. "HiddenField"
  29. "Bold"
  30. "Italic"
  31. "Underline"
  32. "Strike"
  33. "Subscript"
  34. "Superscript"
  35. "RemoveFormat"
  36. "NumberedList"
  37. "BulletedList"
  38. "Outdent"
  39. "Indent"
  40. "Blockquote"
  41. "CreateDiv"
  42. "JustifyLeft"
  43. "JustifyCenter"
  44. "JustifyRight"
  45. "JustifyBlock"
  46. "BidiLtr"
  47. "BidiRtl"
  48. "Link"
  49. "Unlink"
  50. "Anchor"
  51. "CreatePlaceholder"
  52. "Image"
  53. "Flash"
  54. "Table"
  55. "HorizontalRule"
  56. "Smiley"
  57. "SpecialChar"
  58. "PageBreak"
  59. "Iframe"
  60. "InsertPre"
  61. "Styles"
  62. "Format"
  63. "Font"
  64. "FontSize"
  65. "TextColor"
  66. "BGColor"
  67. "UIColor"
  68. "Maximize" = Ein Klick auf diesen Button maximiert den Editor im Browserfenster
  69. "ShowBlocks"
  70. "button1"
  71. "button2"
  72. "button3"
  73. "oembed"
  74. "MediaEmbed"
  75. "About" = das kleine Fragezeichen das mit einem Klick Infos zum Editor Preis gibt
  • Erstellt am .

Unsere Kompetenzen


Alexander´s Webdesign

Mosebergstraße 1
37441, Bad Sachsa

+49-(0)-5523-952 89 98
+49-(0)-160-932 435 66
Diese E-Mail-Adresse ist vor Spambots geschützt! Zur Anzeige muss JavaScript eingeschaltet sein!

Montag - Freitag 09:00 - 18:00 Uhr

Kundenstimmen

So bewerten uns unsere Kunden.

4.8 / 5 bei 25 Stimmen


  • Folgen Sie uns

Copyright © 2003 - 2019 Alexander´s Webdesign - Alle Rechte vorbehalten.