2

デザインに合うようにtinymceのボックスの幅を変更する必要がありますが、方法がわかりません。インターネットを検索しましたが、tinymceのjqueryバージョンの幅に関連するものは見つかりませんでした。

<!-- Load jQuery build -->
<script type="text/javascript" src="{BASE_URL}/js/tiny_mce/jquery.tinymce.js"></script>
<script type="text/javascript">
        $(function() {

                $('textarea.tinymce').tinymce({
                        // Location of TinyMCE script
                        script_url : '{BASE_URL}/js/tiny_mce/tiny_mce.js',

                        // General options
                        theme : "advanced",             
                        plugins : "pagebreak,style,layer,table,save,advhr,advimage,advlink,emotions,iespell,inlinepopups,insertdatetime,preview,media,searchreplace,print,contextmenu,paste,directionality,fullscreen,noneditable,visualchars,nonbreaking,xhtmlxtras,template",

                        // Theme options
                        theme_advanced_buttons1 : "save,newdocument,|,bold,italic,underline,strikethrough,|,justifyleft,justifycenter,justifyright,justifyfull,styleselect,formatselect,fontselect,fontsizeselect",
                        theme_advanced_buttons2 : "cut,copy,paste,pastetext,pasteword,|,search,replace,|,bullist,numlist,|,outdent,indent,blockquote,|,undo,redo,|,link,unlink,anchor,image,cleanup,help,code,|,insertdate,inserttime,preview,|,forecolor,backcolor",
                        theme_advanced_buttons3 : "tablecontrols,|,hr,removeformat,visualaid,|,sub,sup,|,charmap,emotions,iespell,media,advhr,|,print,|,ltr,rtl,|,fullscreen",
                        theme_advanced_buttons4 : "insertlayer,moveforward,movebackward,absolute,|,styleprops,|,cite,abbr,acronym,del,ins,attribs,|,visualchars,nonbreaking,template,pagebreak",
                        theme_advanced_toolbar_location : "top",
                        theme_advanced_toolbar_align : "left",
                        theme_advanced_statusbar_location : "bottom",
                        theme_advanced_resizing : true,

                        // Example content CSS (should be your site CSS)
                        content_css : "css/content.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",

                        // Replace values for the template plugin
                        template_replace_values : {
                                username : "Some User",
                                staffid : "991234"
                        }
                });
        });


</script>

<td>Description: </td><td><textarea style="height:150px;" name="description" class=" tinymce"></textarea></td> //textarea
4

3 に答える 3

3

Tinymceエディタの幅を設定しようとしましたか？http://www.tinymce.com/wiki.php/Configuration:widthを参照してください

tinyMCE.init({
        ...
        width : "840"
});

jQueryの場合：

$(function() {

     $('textarea.tinymce').tinymce({
         //...
         width: "840"
     });
});

このフィドルもチェックしてくださいhttp://fiddle.tinymce.com/eaaaab

1行で有効にするボタンが多すぎると、エディターを狭くすることができなくなります。

于 2013-02-27T08:25:53.893 に答える
1 
tinyMCE.init({
    ...
    width : "640"
    // width: '100%',
});

こちらを確認してください

于 2013-02-27T08:25:25.470 に答える
1

プロジェクトでjQueryプラグインバージョンを使用しています。これはあなたが必要とするものです：

$(selector).tinymce({
    theme: 'advanced', // basic or advanced
    theme_advanced_resizing : false,
    theme_advanced_resize_horizontal: false,
    theme_advanced_resizing_max_width: '500',
    theme_advanced_resizing_min_height: '300',
    width: '500',
    height: '300'
});

CSSを使用して幅を強制する場合は、次のことを試してください。

.mceEditor > table {
    width: 200px !important;
}

（TinyMCEの幅と高さが不従順です！）を参照してください。

于 2013-02-27T08:25:40.683 に答える