2010-04-13 4 views
9

Ich benutze Tinymce und ich möchte die Symbolleiste der Schaltfläche ausblenden. Gibt es eine Möglichkeit, das zu tun?TinyMCE Verstecken Sie die Leiste

+0

In diesem Fall gehen Sie bitte weiter und ausblenden. –

+0

Wie kann ich das machen? – Mercer

+0

Mercer

Antwort

5

Es gibt ein Plugin, das dies entweder über einen Link außerhalb des Editors oder über die Symbolleiste selbst erledigt.

http://www.neele.name/pdw_toggle_toolbars/

herunterladen und extrahieren, um Ihre/tiny_mce/plugins/Ordner

Dann fügen:

$('textarea.tinymce').tinymce({ 
    plugins : "pdw,your other plugins ... " 
    // All of your other configurations 
    theme_advanced_buttons1 : "pdw_toggle,bold,italic,underline and the rest... 
    // Add PDW 
    pdw_toggle_on : 1, 
    pdw_toggle_toolbars : "2,3,4" 
} 
+0

Wo: pdw_toggle_toolbars: "2,3,4" sind die Zeilen, die Sie ausblenden möchten. – ablemike

+0

ist es aus Javascript oder mit jQuery gemacht –

2

A quick and dirty fix wäre, einfach es durch CSS zu verstecken

#my_textarea_id_tbl tr.mceFirst { display:none; } 

Wenn es nur aus optischen Gründen könnte dies enoug sein h.

3

Wenn ed ist ein Verweis auf Ihre tinymce Editor Beispiel können Sie die folgende jQuery-Snippet verwenden, um die Symbolleiste auszublenden:

$('#'+ed.id+'_toolbargroup').parent().css('display','none'); 

Verwendung

$('#'+ed.id+'_toolbargroup').parent().css('display','block') 

es zurück zu bekommen;

0
$(".mceToolbar:eq(1)").hide(); 

für Sie arbeiten wird

eq ersetzen (1) mit dem Knopf Behälter Symbolleiste z eq (2), eq (3), eq (4) ..

0

, wenn Sie eine Inspektion auf Sie Baum DOM tun, werden Sie feststellen:

<a id="tinyelement_external_close" href="javascript:;" class="mceExternalClose"></a> 

So JQuery Anweisung fügen inneren HTML zu haben, wie folgende

$('a#tinyelement_external_close').html('Close') 

Sie haben:

<a id="tinyelement_external_close" href="javascript:;" class="mceExternalClose">Close</a> 

aktualisieren Sie Seite finden close Link oben rechts auf toolb ar. Klicken Sie darauf. Symbolleiste wird ausgeblendet.

8

Mit tinyMCE 4 können Sie die folgende im tinymce init:

toolbar: false 

Hier ist ein vollständiges Beispiel der init, wenn Sie einen sauberen Editor ohne Optionen wollen:

<script type="text/javascript"> 
    tinymce.init({ 
     menubar: false, 
     statusbar: false, 
     toolbar: false 
    }); 
</script> 
1

in tinymce4, Inline-Modus verwende ich einfach:

tinymce.EditorManager.activeEditor.getElement().blur(); 
1

einfach, Thema verwenden: 'Erweitert', theme_advanced_statusbar_location: 'none',

0

wir können das Ausschneiden, Kopieren, Einfügen in Menü verstecken:

tinymce.init({ 
    selector: 'textarea', // change this value according to your HTML 
    menu: { 
    file: {title: 'File', items: 'newdocument'}, 
    edit: {title: 'Edit', items: 'undo redo | selectall'}, // | cut copy paste pastetext we can remove it because it won't work 
    insert: {title: 'Insert', items: 'link media | template hr'}, 
    view: {title: 'View', items: 'visualaid'}, 
    format: {title: 'Format', items: 'bold italic underline strikethrough superscript subscript | formats | removeformat'}, 
    table: {title: 'Table', items: 'inserttable tableprops deletetable | cell row column'}, 
    tools: {title: 'Tools', items: 'spellchecker code'} 
    } 
}); 
Verwandte Themen