embedded media not showing up in html editor in TinyMCE
And it won't save.
- I use the media plugin to insert a video from youtube.
- The movie shows up in preview.
- I press insert.
- This is what
ed.execCommand('mceInsertContent', false, h);
outputs in media.js:<img src="http://127.0.0.1:8000/media/admin/tinymce/jscripts/tiny_mce/plugins/media/img/trans.gif" class="mceItemFlash" title="src:'http://www.youtube.com/v/b7wJejHIFEc&feature',width:'376',height:'302'" width="376" height="302" align="" />
when I press insert/submit. - I see a yellow box inside the editor.
- I check the source html and all I see is a
<p> </p>
where the move embed stuff should be. - I save and the yellow box is gone.
Here is my current tinymce init script:
tinyMCE.init({
// General
mode: 'none',
theme: 'advanced',
skin: 'grappelli',
dialog_type: 'window',
browsers: 'gecko,msie,safari,opera',
editor_deselector : 'mceNoEditor',
language: "en",
relative_urls: false,
plugins: 'advimage,advlink,fullscreen,paste,searchreplace,grappelli,grappelli_contextmenu,media',
// callbackss
file_browser_callback: 'CustomFileBrowser',
// Layout
width: 410,
height: 500,
indentation: '10px',
object_resizing: false,
// Accessibility
cleanup_on_startup: true,
accessibility_warnings: false,
remove_trailing_nbsp: true,
fix_list_elements : true,
remove_script_host: true,
// theme_advanced
theme_advanced_toolbar_location: "top",
theme_advanced_toolbar_align: "left",
theme_advanced_statusbar_location: "bottom",
theme_advanced_buttons1: "formatselect,styleselect,|,bold,italic,underline,|,bullist,numlist,blockquote,|,undo,redo,|,link,unlink,|,image,media,|,fullscreen,|,grappelli_adv",
theme_advanced_buttons2: "search,|,past开发者_JAVA百科eword,charmap,|,code,|,table,cleanup,grappelli_documentstructure",
theme_advanced_buttons3: "",
theme_advanced_path: false,
theme_advanced_blockformats: "p,h2,h3,h4,pre",
theme_advanced_styles: "[all] clearfix=clearfix;[p] small=small;[img] Image left-aligned=img_left;[img] Image left-aligned (nospace)=img_left_nospacetop;[img] Image right-aligned=img_right;[img] Image right-aligned (nospace)=img_right_nospacetop;[img] Image Block=img_block;[img] Image Block (nospace)=img_block_nospacetop;[div] column span-2=column span-2;[div] column span-4=column span-4;[div] column span-8=column span-8",
theme_advanced_resizing : true,
theme_advanced_resize_horizontal : false,
theme_advanced_resizing_use_cookie : true,
theme_advanced_styles: "Image left-aligned=img_left;Image left-aligned (nospace)=img_left_nospacetop;Image right-aligned=img_right;Image right-aligned (nospace)=img_right_nospacetop;Image Block=img_block",
// Adv (?)
advlink_styles: "intern=internal;extern=external",
advimage_update_dimensions_onchange: true,
// grappelli
grappelli_adv_hidden: false,
grappelli_show_documentstructure: 'on',
// elements
/*
valid_elements : [
'-p,','a[href|target=_blank|class]','-strong/-b','-em/-i','-u','-ol',
'-ul','-li','br','img[class|src|alt=|width|height]','-h2,-h3,-h4','-pre','-blockquote','-code','-div'
].join(','),
extended_valid_elements: [
'a[name|class|href|target|title|onclick]',
'img[class|src|border=0|alt|title|hspace|vspace|width|height|align|onmouseover|onmouseout|name]',
'br[clearfix]',
'-p[class<clearfix?summary?code]',
'h2[class<clearfix],h3[class<clearfix],h4[class<clearfix]',
'ul[class<clearfix],ol[class<clearfix]',
'div[class]',
'object[align<bottom?left?middle?right?top|archive|border|class|classid'
+ "|codebase|codetype|data|declare|dir<ltr?rtl|height|hspace|id|lang|name"
+ "|onclick|ondblclick|onkeydown|onkeypress|onkeyup|onmousedown|onmousemove"
+ "|onmouseout|onmouseover|onmouseup|standby|style|tabindex|title|type|usemap"
+ "|vspace|width]",
'param[id|name|type|value|valuetype<DATA?OBJECT?REF]',
'embed[src|type|width|height|flashvars|wmode]',
'address'
].join(','),
valid_child_elements : [
'h1/h2/h3/h4/h5/h6/a[%itrans_na]', 'table[thead|tbody|tfoot|tr|td]',
'strong/b/p/div/em/i/td[%itrans|#text]', 'body[%btrans|#text]'
].join(',')
*/
// custom cleanup
// setup: function(ed) {
// // Gets executed before DOM to HTML string serialization
// ed.onBeforeGetContent.add(function(ed, o) {
// // State get is set when contents is extracted from editor
// if (o.get) {
// // Remove empty paragraphs (because this is bad)
// tinymce.each(ed.dom.select('p', o.node), function(n) {
// alert(n.firstChild);
// ed.dom.remove(n);
// });
// // Remove douple spaces
// // o.content = o.content.replace(/<(strong|b)([^>]*)>/g, '');
// }
// });
// }
});
Edit:
Ok I added cleanup: false
to my init script. And now, all I get in my source is this:
<img src="http://127.0.0.1:8000/media/admin/tinymce/jscripts/tiny_mce/plugins/media/img/trans.gif" _mce_src="/media/admin/tinymce/jscripts/tiny_mce/plugins/media/img/trans.gif" class="mceItemFlash" title="src:'http://www.youtube.com/v/b7wJejHIFEc&feature',width:'376',height:'302'" width="376" height="302" align="">
This also shows up in my HTML.
Should TinyMCE not replace this with some embed code, or do I need to do that myself with some javascript?
Solution :
Update tinymce to latest release (3.3.9.2), along with all the plugins. I turned cleanup back on and now it works.
精彩评论