CODEWITHSUNDEEP
javascripttinymcetinymce-4
Mesh
Mesh

Reputation: 61

TinyMCE fixed_toolbar_container configuration

I tried using fixed_toolbar_container configuration inside tinymce.init, but it left me with plain html textarea instead of rich text editor. Here's my code:

<html>
<head>
    <script src="tinymce\js\tinymce\tinymce.min.js"></script>
    <script type="text/javascript">
        tinymce.init({
            selector: "textarea",
            inline: true,
            fixed_toolbar_container: "#mytoolbar",

            plugins: [
                "advlist autolink lists link image charmap print preview anchor",
                "searchreplace visualblocks code fullscreen",
                "insertdatetime media table contextmenu paste"
            ],
            toolbar: "insertfile undo redo | styleselect | bold italic | alignleft aligncenter alignright alignjustify | bullist numlist outdent indent | link image"
        });
    </script>
</head>
<form method="post" action="somepage">
    <div id="mytoolbar" style="width:800; height:80; border : 1px blue solid"></div></BR>
    <textarea id="content"></textarea>
</form>
</html>

I'm using latest, 4.0.1, version of TinyMCE.

Could someone please tell me how should I disintegrate TinyMCE toolbar (which is attached to the top of the textarea) into a separate DIV/iFrame?

I'll appreciate a working sample code.

Thanks in advance!

Upvotes: 3

Views: 5995

Answers (1)

Christoffer Bubach
Christoffer Bubach

Reputation: 1686

You use the selector textarea and also inline: true at the same time, which is conflicting. Either remove the inline setting, or change the selector to some DIV classname or ID that you want editable.

Upvotes: 5

Related Questions