Supprimer le menu et les barres d'état dans TinyMCE 4


113

J'essaie de supprimer le menu et les barres d'état de TinyMCE 4 car je souhaite configurer un éditeur très basique. Est-ce possible?

La documentation de TinyMCE 3 ne semble pas pertinente et je ne trouve rien pour la version 4.


bien css vous pouvez le faire facilement!
— Shivanshu

12
@ShivanshuSrivastava: vous plaisantez, non? :)
— Sk8erPeter

Réponses:


253

J'ai regardé la source et c'était assez évident:

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

Cela supprime les deux.

Vous pouvez également personnaliser quelles parties de la barre de menus par défaut sont visibles en spécifiant une chaîne de menus activés - par exemple menubar: 'file edit'

Vous pouvez définir vos propres menus comme ceci:

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

4
Petite faute de frappe: menuBar: 'file edit'devrait êtremenubar: 'file edit'
— Cory Mawhorter

excellent! une idée comment personnaliser une zone de texte spécifique plutôt que tout?
— abbood

"une idée comment personnaliser une zone de texte spécifique plutôt que tout?" tinymce.init({ mode: "exact", elements: "IdOftextAreaEtc", où IdOftextAreaEtc est l'ID du contrôle à utiliser pour tinyMCE
— David Bridge

1
@DavidBridge, cette syntaxe est pour la version 3.x. À partir de 4.x, vous pouvez utiliser la tinymce.init({ selector: "textarea#IdOfTextarea"})(un peu comme la syntaxe css).
— bvgheluwe

28

Si vous souhaitez supprimer toute la barre de menus du haut

tinymce.init({
    menubar: false,

});

Mais si vous voulez une barre de menus personnalisée avec un sous-menu

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'}
    }
});

voir TinyMCE pour plus d'aide.


4

Donc, il est clairement indiqué dans leurs documents que de rendre les valeurs fausses.

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

Dans la dernière mise à jour de la v5, vous pouvez afficher la barre de menus en tant que telle

    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',
});

voir https://www.tiny.cloud/docs/ pour plus de détails

En utilisant notre site, vous reconnaissez avoir lu et compris notre politique liée aux cookies et notre politique de confidentialité.
Licensed under cc by-sa 3.0 with attribution required.