xhtml Problem mit dem <em> TAG

[wosch]

Bleibt für mich die Frage warum diese Funktion extra für den Gecko implementiert wurde..??

Weil, laut Tiny-Entwickler, die Gecko-RT-Engine nicht mit em und strong umgehen kann.

https://sourceforge.net/tracker/index.p ... tid=635682

Sehr interessante und lehrreiche Beiträge, davon wünschte ich mir mehr.

[HerrB]

Dodger77, könntest Du Dir dann mal den Tipps&Tricks-Artikel vornehmen und die gesammelten Erkenntnisse - auf das Wesentliche gekürzt - da einbauen?

Ich werde mir heute abend mal die anderen Tipps ansehen...

Gruß
HerrB

[Sundriver]

@HerrB und Dodger77,

Ihr könnt das folgende an einer jungfräulichen 4.6.23 reproduzieren, in den Mandanteneinstellungen sind zu Anfang KEINE Einstellungen getätigt, lediglich beim Sysadmin wird bei der Angabe zum XHTML Code erzeugen ein Häckchen gemacht. Zum default Ruleset, in der Original tiny_mce.js ist das default Ruleset enthalten:

Code: Alles auswählen

this._def("valid_elements","+a[id|style|rel|rev|charset|hreflang|dir|lang|tabin
dex|accesskey|type|name|href|target|title|class|onfocus|onblur|onclick|ondblcli
ck|onmousedown|onmouseup|onmouseover|onmousemove|onmouseout|onkeypress|onkeydow
n|onkeyup],-strong/-b[class|style],-em/-i[class|style],-strike[class|style],-u[
class|style],#p[id|style|dir|class|align],-ol[class|style],-ul[class|style],-li
[class|style],br,img[id|dir|lang|longdesc|usemap|style|class|src|onmouseover|on
mouseout|border|alt=|title|hspace|vspace|width|height|align],-sub[style|class],
-sup[style|class],-blockquote[dir|style],-table[border=0|cellspacing|cellpaddin
g|width|height|class|align|summary|style|dir|id|lang|bgcolor|background|borderc
olor],-tr[id|lang|dir|class|rowspan|width|height|align|valign|style|bgcolor|bac
kground|bordercolor],tbody[id|class],thead[id|class],tfoot[id|class],#td[id|lan
g|dir|class|colspan|rowspan|width|height|align|valign|style|bgcolor|background|
bordercolor|scope],-th[id|lang|dir|class|colspan|rowspan|width|height|align|val
ign|style|scope],caption[id|lang|dir|class|style],-div[id|dir|class|align|style
],-span[style|class|align],-pre[class|align|style],address[class|align|style],-
h1[id|style|dir|class|align],-h2[id|style|dir|class|align],-h3[id|style|dir|cla
ss|align],-h4[id|style|dir|class|align],-h5[id|style|dir|class|align],-h6[id|st
yle|dir|class|align],hr[class|style],-font[face|size|style|id|class|dir|color],
dd[id|class|title|style|dir|lang],dl[id|class|title|style|dir|lang],dt[id|class
|title|style|dir|lang],cite[title|id|class|style|dir|lang],abbr[title|id|class|
style|dir|lang],acronym[title|id|class|style|dir|lang],del[title|id|class|style
|dir|lang|datetime|cite],ins[title|id|class|style|dir|lang|datetime|cite]");thi
s._def("extended_valid_elements","");this._def("invalid_elements","");

In der editorclass.php werden die Werte für valid Elements ebenfalls gesetzt und gegenüber der tiny_mce.js auch gleich eingeschaltet:

Code: Alles auswählen

$this->setSetting("apply_source_formatting", true);

Code: Alles auswählen

$this->setSetting("valid_elements", "+a[name|href|target|title],strong/b[class],em/i[class],strike[class],u[class],p[dir|class|align],ol,ul,li,br,
img[class|src|border=0|alt|title|hspace|vspace|width|height|align],sub,sup,blockquote[dir|style]
,table[border=0|cellspacing|cellpadding|width|height|class|align],tr[class|rowspan|width|height|align|valign],
td[dir|class|colspan|rowspan|width|height|align|valign],div[dir|class|align],span[class|align],pre[class|align],
address[class|align],h1[dir|class|align],h2[dir|class|align],h3[dir|class|align],h4[dir|class|align],h5[dir|class|align],h6[dir|class|align],hr");

Ausgehend von dieser Situation , keine geladenen Ausdrücke in den Mandanteneinstellungen, wird beim cleanup das Set aus der editorclass.php verwendet und der Code beim speichern "gereinigt".

Ich habe in meiner editorclass.php die Rule vom <em> tag etwas verändert, em/i[class|style] , ich habe das Argument style hinzugefügt um zu sehen welches Set geladen wird, das aus der tiny_mce.js oder das aus der editorclass.php. Den Quelltextauszug aus dem Editorseitenframe hab ich hier, hier kann man sehr gut sehen was dem Editor an Argumenten mitgegeben wird:

Code: Alles auswählen

<!-- Needs to be seperate script tags! -->
<script language="JavaScript" type="text/javascript">
tinyMCE.init({
	'mode': 'exact',
	'theme': 'advanced',
	'theme_advanced_toolbar_location': 'top',
	'theme_advanced_path_location': 'bottom',
	'remove_script_host': false,
	'file_browser_callback': 'myCustomFileBrowser',
	'urlconverter_callback': 'CustomURLConverter',
	'apply_source_formatting': true,
	'remove_linebreaks': false,
	'convert_urls': true,
	'relative_urls': true,
	'elements': 'CMS_HTML',
	'language': 'de',
	'document_base_url': 'http://www.****.de/cms/',
	'cleanup_callback': 'CustomCleanupContent',
	'width': '100%',
	'height': '480px',
	'directionality': 'ltr',
	'theme_advanced_toolbar_align': 'left',
	'plugin_insertdate_dateFormat': '%Y-%m-%d',
	'plugin_insertdate_timeFormat': '%H:%M:%S',
	'theme_advanced_buttons1':
'cut,copy,paste,pastetext,pasteword,separator,search,replace,separator,undo,redo,separator,bold,italic,underline,strikethrough,sub,sup,separator,insertdate,inserttime,preview,s
eparator,styleselect',
	'theme_advanced_buttons2':
'link,unlink,anchor,image,media,advhr,separator,bullist,numlist,separator,outdent,indent,separator,justifyleft,justifycenter,justifyright,justifyfull,removeformat,separator,for
ecolor,backcolor,separator,ltr,rtl,separator,fullscreen,visualaid,charmap,cleanup,separator,code',
	'theme_advanced_buttons3': 'tablecontrols,separator,formatselect,fontselect,fontsizeselect',
	'plugins': 'table,save,advhr,advimage,advlink,insertdatetime,preview,zoom,media,searchreplace,print,contextmenu,paste,directionality,fullscreen,inlinepopups',
	'valid_elements':
'+a[name|href|target|title],strong/b[class],em/i[class|style],strike[class],u[class],p[dir|class|align],ol,ul,li,br,img[class|src|border=0|alt|title|hspace|vspace|width|height|
align],sub,sup,blockquote[dir|style],table[border=0|cellspacing|cellpadding|width|height|class|align],tr[class|rowspan|width|height|align|valign],td[dir|class|colspan|rowspan|w
idth|height|align|valign],div[dir|class|align],span[class|align],pre[class|align],address[class|align],h1[dir|class|align],h2[dir|class|align],h3[dir|class|align],h4[dir|class|
align],h5[dir|class|align],h6[dir|class|align],hr',
	'extended_valid_elements':
'form[name|action|method],textarea[name|style|cols|rows],input[type|name|value|style|onclick],a[name|href|target|title|onclick],img[class|src|border=0|alt|title|hspace|vspace|w
idth|height|align|onmouseover|onmouseout|name],hr[class|width|size|noshade],font[face|size|color|style],span[class|align|style]',
	'contenido_background_color': 'white',
	'article_url_suffix': 'front_content.php?idart=137'
});
</script>
<!-- /tinyMCE -->

Wenn also KEINE Angaben in den Mandanteneinstellungen definiert werden kommen die Werte aus der editorclass.php zur Anwendung.

Danach schrieb ich folgendes bei den Mandanteneinstellungen Sprachübergreifend in die Wertetabelle: wysiwyg tinymce-valid-elements strong/b[class]
, wenn der Editor nun erneut geöffnet wird findet sich im Quelltext aus dem Editorframe folgendes:

Code: Alles auswählen

<!-- Needs to be seperate script tags! -->
<script language="JavaScript" type="text/javascript">
tinyMCE.init({
	'mode': 'exact',
	'theme': 'advanced',
	'theme_advanced_toolbar_location': 'top',
	'theme_advanced_path_location': 'bottom',
	'remove_script_host': false,
	'file_browser_callback': 'myCustomFileBrowser',
	'urlconverter_callback': 'CustomURLConverter',
	'apply_source_formatting': true,
	'remove_linebreaks': false,
	'convert_urls': true,
	'relative_urls': true,
	'elements': 'CMS_HTML',
	'language': 'de',
	'document_base_url': 'http://www.****.de/cms/',
	'cleanup_callback': 'CustomCleanupContent',
	'width': '100%',
	'height': '480px',
	'directionality': 'ltr',
	'theme_advanced_toolbar_align': 'left',
	'plugin_insertdate_dateFormat': '%Y-%m-%d',
	'plugin_insertdate_timeFormat': '%H:%M:%S',
	'theme_advanced_buttons1':
'cut,copy,paste,pastetext,pasteword,separator,search,replace,separator,undo,redo,separator,bold,italic,underline,strikethrough,sub,sup,separator,insertdate,inserttime,preview,s
eparator,styleselect',
	'theme_advanced_buttons2':
'link,unlink,anchor,image,media,advhr,separator,bullist,numlist,separator,outdent,indent,separator,justifyleft,justifycenter,justifyright,justifyfull,removeformat,separator,for
ecolor,backcolor,separator,ltr,rtl,separator,fullscreen,visualaid,charmap,cleanup,separator,code',
	'theme_advanced_buttons3': 'tablecontrols,separator,formatselect,fontselect,fontsizeselect',
	'plugins': 'table,save,advhr,advimage,advlink,insertdatetime,preview,zoom,media,searchreplace,print,contextmenu,paste,directionality,fullscreen,inlinepopups',
	'valid_elements': 'strong/b[class]',
	'extended_valid_elements':
'form[name|action|method],textarea[name|style|cols|rows],input[type|name|value|style|onclick],a[name|href|target|title|onclick],img[class|src|border=0|alt|title|hspace|vspace|w
idth|height|align|onmouseover|onmouseout|name],hr[class|width|size|noshade],font[face|size|color|style],span[class|align|style]',
	'contenido_background_color': 'white',
	'article_url_suffix': 'front_content.php?idart=137'
});
</script>
<!-- /tinyMCE -->

Es wird der tiny_mce.init{} also lediglich dieses einzelne Argument mitgegeben.

Wenn aber nun statt dessen ein *[*][/b] als Wildcard übergeben wird funktioniert das Code Cleanup nicht, ich denke es kann mit der Wildcard schlichtweg nix anfangen.

Ich sehe das für mich so, es ist kein Bug im TinyMCE, ich denke das man bei der Übergabe der Werte der Mandanteneinstellungen entscheiden sollte welche Werte der tini_mce.init {} zur Erledigung mitgegeben werden sollen.
Trägt der User nix ein wird, wie geschehen, die valid Elements Definition übernommen die in der editorclass.php definiert ist, eben so sollte das passieren wenn der User die Wildcard benutzt und im Fall der User explizit einzelne Werte für valid-Elements definieren sollte, sollten auch nur diese übernommen werden.
Gibt er wie gesagt lediglich die Wildcard an, wird so wie es im Moment ist, kein Code Cleanup durchgeführt.
Getestet habe ich das nur mit der aktuellen 4.6.23, ich hab kein Plan wie das mit früheren Versionen ist.

[wosch]

Hat an sich nichts mit dem Problem primär zu tun, paßt aber hier rein.

In dem Bugtracker oben wird ja berichtet das embed ersetzt wird zu ibed
das ist eine Folge dieses ersetzens wie von sundriver beschrieben.

Das würde auch dieses Posting erklären:

http://www.contenido.de/forum/viewtopic.php?t=18380

In der neueren Version des Tiny 2.2.x wurde der Ersetzungscode geändert so daß dieser Effekt nicht mehr auftritt.

[Sundriver]

@wosch,

da ich ja diese "Kastration" in der tiny_mce.js rückgängig gemacht habe, und diese Funktion ja nur für die Gecko Engine galt ( es funktioniert ja ohne das ausschneiden dieser Funktion jetzt ) müsste es mit einer Erweiterung in folgender Form embed/ibed[class|src|border=0|alt|title|hspace|vspace|width|height|align|name] in dem Ruleset der editorclass.php wieder funktionieren.

nicht getestet..

//Edit: funktioniert nicht, wahrscheinlich deshalb weil das embed Element nie zum HTML Standart gehörte und deshalb nicht valid sein kann.