TinyMCE Bootstrap Icons plugin

Bootstrap Icons plugin for TinyMCE 5

Installation guide, technical informations


Supported browsers

  • All major browsers supported by TinyMCE and supporting SVG
    • Chrome
    • Firefox
    • Safari
    • Edge
    • IE 11
    • All major mobile browsers
    • etc.


  • Copy uncompressed folder booticons into your /tinymce/js/tinymce/plugins/ folder (depending on your TinyMCE path)
  • Edit your tinymce.init()
    • Add booticons into plugins
    • Add booticons into toolbar
    • (optional) Add booticons into menu - TinyMCE documentation
    • (optional) Add booticons_default_color definition - default is '858796'
    • (optional) Add booticons_sizes definition - default is '16, 20, 30, 40, 70, 100, 140' (make sure it fits in the dialog box if you choose larger dimensions)
    • (optional) Add booticons_default_size definition - default is '40'
      acceptable values depends on booticons_sizes
    Example tinymce.init() - exactly the same is used on demo page:
        height : 500,
        //language : "cs",
        selector : "#tiny",
        toolbar: "booticons",
        plugins: 'booticons code',
        booticons_default_color: 'c74848',
        booticons_sizes: '16, 20, 30, 40, 70, 100, 140',
        booticons_default_size: '40',
        menubar: 'insert view',
        menu: {
          insert: { title: 'Insert', items: 'booticons' },
          view: { title: 'View', items: 'code' }


  • Plugin is in default english language, the only one other is Czech - 'cs' language
  • If you need some other, it's easy to add new language:
    • Copy cs.js file in the langs subfolder of plugin
    • Rename file to yuorlangshortcut.js (for example ca.js for Catalan) - list of languages with shortcuts is here on TinyMCE page
    • Edit new language file - change lang shortcut on first row and translate it to your language (it's only 5 items, it's easy)
      Example - cs.js language file:
        "Bootstrap icons": "Bootstrap ikony",
        "Icon selection": "Výběr ikony",
        "Settings": "Nastavení",
        "Icon size": "Velikost ikony",
        "Icon color": "Barva ikony"

About Bootstrap Icons

Icons in this plugin are from 1.4.0 version of Bootstrap Icons. Bootstrap Icons license - MIT
Our other TinyMCE plugins: