Rimuovi menu e barre di stato in TinyMCE 4


113

Sto cercando di rimuovere il menu e le barre di stato da TinyMCE 4 perché voglio impostare un editor molto semplice. È possibile?

La documentazione per TinyMCE 3 non sembra essere rilevante e non riesco a trovare nulla per la versione 4.


bene css puoi farlo facilmente!
— Shivanshu

12
@ShivanshuSrivastava: stai scherzando, vero? :)
— Sk8erPeter

Risposte:


253

Ho guardato la fonte ed era abbastanza ovvio:

tinyMCE.init({
    menubar:false,
    statusbar: false,
        //etc
})

Questo rimuove entrambi.

È inoltre possibile personalizzare quali parti della barra dei menu predefinita sono visibili specificando una stringa di menu abilitati, ad es menubar: 'file edit'

Puoi definire i tuoi menu in questo modo:

menu : {    
    test: {title: 'Test Menu', items: 'newdocument'} 
},
menubar: 'test'

4
Piccolo errore di battitura: menuBar: 'file edit'dovrebbe esseremenubar: 'file edit'
— Cory Mawhorter

eccellente! qualche idea su come personalizzare una specifica area di testo piuttosto che tutte?
— abbood

"qualche idea su come personalizzare una specifica textarea piuttosto che tutte?" tinymce.init({ mode: "exact", elements: "IdOftextAreaEtc", dove IdOftextAreaEtc è l'id del controllo da utilizzare per tinyMCE
— David Bridge

1
@DavidBridge, questa sintassi è per la versione 3.x. Da 4.x, puoi usare la tinymce.init({ selector: "textarea#IdOfTextarea"})(molto simile alla sintassi css).
— bvgheluwe

28

Se desideri rimuovere l'intera barra dei menu dall'alto

tinymce.init({
    menubar: false,

});

Ma se vuoi la barra dei menu personalizzata con alcuni sottomenu

tinymce.init({
    menu: {
        file: {title: 'File', items: 'newdocument'},
        edit: {title: 'Edit', items: 'undo redo | cut copy paste pastetext | selectall'},
        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'}
    }
});

vedere TinyMCE per ulteriore assistenza.


4

Quindi, è chiaramente indicato nei loro documenti che rendere i valori falsi.

    tinymce.init({
    menubar: false,
    branding: false,
    statusbar: false,
   })

Nell'ultimo aggiornamento alla v5 è possibile visualizzare la barra dei menu come tale

    tinymce.init({
     menu: {
      edit: { title: 'Edit', items: 'undo redo | cut copy paste pastetext | selectall searchreplace' },
      insert: { title: 'Insert', items: 'image link charmap pagebreak' },
      format: { title: 'Format', items: 'bold italic underline strikethrough superscript subscript | formats | removeformat' },
      table: { title: 'Table', items: 'inserttable tableprops deletetable | cell row column' }
    },
    menubar: 'edit insert format table',
});

vedere https://www.tiny.cloud/docs/ per maggiori dettagli

Utilizzando il nostro sito, riconosci di aver letto e compreso le nostre Informativa sui cookie e Informativa sulla privacy.
Licensed under cc by-sa 3.0 with attribution required.