blog.bartlweb - a technologist's external brain

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;
}

Dieser Artikel hat dir deinen Tag gerettet?
... und mühevolles Probieren, Recherchieren und damit Stunden an Zeit gespart? ... oder einfach nur dein Problem gelöst?

Dann würde ich mich freuen, wenn Du meine Zeit für die Erstellung dieses Blogartikels mit einer kleinen Spende honorierst:

Kommentare

Noch kein Kommentar vorhanden.
Sei der Erste - ich freue mich über deine Anmerkungen, Kritik und Fragen.

Kommentar schreiben

Deine E-Mailadresse wird nur für Benachrichtigungen und Rückfragen verwendet und wird nicht veröffentlicht.

Benachrichtigungen können jederzeit wieder abbestellt werden.

Bitte tippe die Zahlenkombination "1646" ein, nur dann kann ich deinen Kommentar entgegennehmen.

Bitte fülle dieses Feld nicht aus, nur dann kann ich deinen Kommentar entgegennehmen.