2

CSSで幅を設定するために、クラス属性を使用して特定のiframeをターゲットにします。

iframeは、次のようなGoogleマップの埋め込みです。

<iframe width="425" height="350" frameborder="0" scrolling="no" marginheight="0" marginwidth="0" src="https://maps.google.co.uk/?ie=UTF8&amp;t=m&amp;ll=52.8382,-2.327815&amp;spn=4.646012,9.338379&amp;z=6&amp;output=embed"></iframe>

それらはコピーされ、tinyMCEのHTMLソースエディタに貼り付けられます。クラス属性をiframeに適用する必要がありますが、ソースエディタで[更新]をクリックすると削除されます。

構成でvalid_elementsとextended_valid_elementsを使用しようとしましたが、どちらもiframe[class]では機能しません。

バージョン3.4.3を実行しています。3.5.7をダウンロードしましたが、同じ問題があるようです。この動作は、クラス属性がサポートされていると述べているvalid_elementsのドキュメント(http://www.tinymce)にも関わらず、tinyMCE Webサイト(http://www.tinymce.com/tryit/full.php)のデモにも示されています。 com / wiki.php / Configuration:valid_elements)。

完全な構成は次のとおりです。

tinyMCE.init({
    // General options
    mode : "specific_textareas",
    editor_selector : "formInputWysiwyg",
    theme : "advanced",
    plugins : "autolink,lists,pagebreak,style,layer,table,save,advhr,advimage,advlink,emotions,iespell,inlinepopups,insertdatetime,preview,media,searchreplace,print,contextmenu,paste,fullscreen,noneditable,visualchars,nonbreaking,xhtmlxtras,wordcount,advlist",

    // Theme options
    theme_advanced_buttons1 : "bold,italic,strikethrough,formatselect,styleselect,undo,redo,|,code,|,fullscreen,",
    theme_advanced_buttons2 : "cut,copy,paste,pastetext,|,search,replace,|,bullist,numlist,|,blockquote,nonbreaking,|,charmap,media,|,link,unlink,anchor,image",
    theme_advanced_buttons3 : "",
    theme_advanced_buttons4 : "",
    theme_advanced_toolbar_location : "top",
    theme_advanced_toolbar_align : "left",
    theme_advanced_statusbar_location : "bottom",
    theme_advanced_resizing : true,
    width : "500",
    height : "600",
    apply_source_formatting : true,
    remove_linebreaks: true,
    theme_advanced_blockformats : "p,blockquote,h1,h2,h3,h4,h5,h6",
    forced_root_block : false,
    plugin_preview_width : "1050",
    plugin_preview_height : "800",
    convert_urls : false,
    extended_valid_elements : "figure,figcaption",

    // Skin options
    skin : "o2k7",
    skin_variant : "silver",

    // Example content CSS (should be your site CSS)
    content_css : "/admin/includes/css/tinymce.css",

    // Drop lists for link/image/media/template dialogs
    template_external_list_url : "lists/template_list.js",
    external_link_list_url : "lists/link_list.js",
    external_image_list_url : "lists/image_list.js",
    media_external_list_url : "lists/media_list.js",

    // Style formats
    style_formats : [
        {title : 'Google Maps', selector : 'iframe', classes : 'google-maps-embed'},
        {title : 'Intro', selector : 'p', classes : 'intro'},
        {title : 'News Image', selector : 'img', classes : 'news-image'}
    ],
});
4

3 に答える 3

2

\ tinymce \ jscripts \ tiny_mce \ plugins \ media \ editor_plugin_src.jsで、12行目のrootAttributesから「クラス」を削除し、jscompress.comを使用して縮小し、editor_plugin.jsの内容を置き換えることで、この問題を修正しました。ファイル(同じフォルダー内)。

かわった:

 var rootAttributes = tinymce.explode('id,name,width,height,style,align,class,hspace,vspace,bgcolor,type')

に:

 var rootAttributes = tinymce.explode('id,name,width,height,style,align,hspace,vspace,bgcolor,type')

これは3.5.8でもまだ問題であり、バグとして提出されています。

于 2012-11-28T03:45:45.270 に答える
1

「メディア」プラグインを有効にしましたか?同様の問題が発生していますが、メディアプラグインがHTML要素でのエディターの通常の操作を妨げているのではないかと思います。iframeを操作するためのstyle_formatsオプションを作成しようとしましたが、うまくいきませんでした。

于 2012-11-09T16:19:16.813 に答える