TinyMCE in Alfresco 4 an die eigenen Bedürfnisse anpassen
Ergänzend zu meinem Artikel TinyMCE in Alfresco 3.3 an die eigenen Bedürfnisse anpassen gibt es hier die abgewandelte Konfiguration für Alfresco 4.0. In TinyMCE unter Alfresco 4.0 erkennt dieser leider nicht mehr automatisch ob es sich bei der Textauswahl für den Stil Code/Cite um einen Absatz oder einen Inline-Style (span) handelt, daher muss für beide Fälle ein eigener Stil definiert werden.
Im oben erwähnten Basisartikel wird erklärt in welchen Dateien und an welcher Stelle die Änderungen vorgenommen werden müssen, daher poste ich hier nur den neuen Code.
Wiki
this.pageEditor = Alfresco.util.createImageEditor(this.id + '-content',
{
height: 400,
width: 800,
theme: "advanced",
plugins: "table,visualchars,emotions,advhr,print,directionality,fullscreen,insertdatetime",
content_css : "/share/themes/default/presentation.css",
theme_advanced_buttons1 : "formatselect,styleselect,|, bold,italic,underline,strikethrough,sup,sub,|,justifyleft,justifycenter,justifyright,|,bullist,numlist,outdent,indent,|,forecolor,backcolor",
theme_advanced_buttons2 : "undo,redo,|,link,unlink,|,image,|,charmap,insertdate,inserttime,|,removeformat,cleanup,code,pasteword,|,fullscreen",
theme_advanced_buttons3 : "",
theme_advanced_blockformats : "p,h1,h2,h3,h4",
theme_advanced_toolbar_location: "top",
theme_advanced_toolbar_align: "left",
theme_advanced_statusbar_location: "bottom",
theme_advanced_path : false,
theme_advanced_resizing: true,
siteId: this.options.siteId,
language:this.options.locale,
convert_fonts_to_spans:true,
inline_styles:false,
style_formats:[
{title:'Code', selector: 'p', classes : 'code'},
{title:'Code-Inline', inline: 'span', classes : 'code'},
{title:'Zitat', selector: 'p', classes : 'cite'},
{title:'Zitat-Inline', inline: 'span', classes : 'cite'},
]
});
this.pageEditor.addPageUnloadBehaviour(this.msg("message.unsavedChanges.wiki"));
this.pageEditor.render();
und
this.widgets.editor = Alfresco.util.createImageEditor(this.id + '-content',
{
height: 400,
width: 800,
theme: "advanced",
plugins: "table,visualchars,emotions,advhr,print,directionality,fullscreen,insertdatetime",
content_css : "/share/themes/default/presentation.css",
theme_advanced_buttons1 : "formatselect,styleselect,|, bold,italic,underline,strikethrough,sup,sub,|,justifyleft,justifycenter,justifyright,|,bullist,numlist,outdent,indent,|,forecolor,backcolor",
theme_advanced_buttons2 : "undo,redo,|,link,unlink,|,image,|,charmap,insertdate,inserttime,|,removeformat,cleanup,code,pasteword,|,fullscreen",
theme_advanced_buttons3 : "",
theme_advanced_blockformats : "p,h1,h2,h3,h4",
theme_advanced_toolbar_location: "top",
theme_advanced_toolbar_align: "left",
theme_advanced_statusbar_location: "bottom",
theme_advanced_path : false,
theme_advanced_resizing: true,
siteId: this.options.siteId,
language:this.options.locale,
convert_fonts_to_spans:true,
inline_styles:false,
style_formats:[
{title:'Code', selector: 'p', classes : 'code'},
{title:'Code-Inline', inline: 'span', classes : 'code'},
{title:'Zitat', selector: 'p', classes : 'cite'},
{title:'Zitat-Inline', inline: 'span', classes : 'cite'},
]
});
this.widgets.editor.addPageUnloadBehaviour(this.msg("message.unsavedChanges.blog"));
this.widgets.editor.render();
Blog
this.widgets.editor = Alfresco.util.RichEditor(Alfresco.constants.HTML_EDITOR,this.id + '-content',
{
height: 400,
width: 800,
theme: "advanced",
plugins: "table,visualchars,emotions,advhr,print,directionality,fullscreen,insertdatetime",
content_css : "/share/themes/default/presentation.css",
theme_advanced_buttons1 : "formatselect,styleselect,|, bold,italic,underline,strikethrough,sup,sub,|,justifyleft,justifycenter,justifyright,|,bullist,numlist,outdent,indent,|,forecolor,backcolor",
theme_advanced_buttons2 : "undo,redo,|,link,unlink,|,image,|,charmap,insertdate,inserttime,|,removeformat,cleanup,code,pasteword,|,fullscreen",
theme_advanced_buttons3 : "",
theme_advanced_blockformats : "p,h1,h2,h3,h4",
theme_advanced_toolbar_location: "top",
theme_advanced_toolbar_align: "left",
theme_advanced_statusbar_location: "bottom",
theme_advanced_path : false,
theme_advanced_resizing: true,
siteId: this.options.siteId,
language:this.options.locale,
convert_fonts_to_spans:true,
inline_styles:false,
style_formats:[
{title:'Code', selector: 'p', classes : 'code'},
{title:'Code-Inline', inline: 'span', classes : 'code'},
{title:'Zitat', selector: 'p', classes : 'cite'},
{title:'Zitat-Inline', inline: 'span', classes : 'cite'},
]
});
this.widgets.editor.addPageUnloadBehaviour(this.msg("message.unsavedChanges.blog"));
this.widgets.editor.render();
CSS
p {
padding:0;
margin:0;
margin-bottom: 15px;
font-size: 13px;
}
p.code, span.code {
font-family: Courier;
}
p.code, .alfresco-share .sticky-wrapper p.code, .yui-panel-container p.code {
border: 1px dotted #CCCCCC;
background-color: #F0F0F0;
padding: 10px;
margin-left: 10px;
}
p.cite, span.cite {
font-style: italic;
}
p.cite, .alfresco-share .sticky-wrapper p.cite, .yui-panel-container p.cite {
margin-left: 10px;
padding-left: 10px;
padding-top: 10px;
padding-bottom: 10px;
border-left: 1px dotted #777777;
background-color: #F0F0F0;
}
p.cite, p.code {
overflow: auto;
}
li {
font-size: 13px;
}
.rich-content ul, #tinymce ul, .rich-content ol, #tinymce ol, .postview .content ul, .postview .content ol {
padding: 0;
padding-left: 1em;
margin-bottom: 15px;
}
.rich-content h1, #tinymce h1, .postview .content h1 {
margin: 0;
padding: 0;
margin-bottom: 5px;
padding-top: 20px;
border-bottom: 1px dotted #515D6B;
}
.rich-content h2, #tinymce h2, .postview .content h2 {
margin: 0;
padding: 0;
margin-bottom: 5px;
padding-top: 15px;
}
.rich-content h3, #tinymce h3, .postview .content h3 {
margin: 0;
padding: 0;
margin-bottom: 3px;
padding-top: 15px;
}
.rich-content h4, #tinymce h4, .postview .content h4 {
margin: 0;
padding: 0;
margin-bottom: 3px;
padding-top: 10px;
font-size: 90%;
font-weight: bold;
}
