Bootstrap Widgets
CKEditor add-on
TinyMCE add-on
Bootstrap Editor add-on
Purchase logo
Get for Bootstrap
Purchase logo
Get for Foundation

Install Bootstrap Widgets to TinyMCE

  1. Unpack archived files directly to tinymce/plugins.
  2. Turn on the plugin in initialization script:
    plugins: 'jsplusInclude,jsplus_bootstrap_alert,jsplus_bootstrap_breadcrumbs,jsplus_bootstrap_button,jsplus_bootstrap_gallery,jsplus_bootstrap_icons,jsplus_bootstrap_badge,jsplus_bootstrap_label,jsplus_font_awesome'
  3. Specify framework (Bootstrap or Foundation) for Include CSS/JS add-on:
    jsplusInclude: {
    	framework: "b3" // or "b4", "f5", "f6"
    b3 means Bootstrap 3 here.
    This option will affect to all other CSS framework-specific add-ons too.
    Read more about framework option or including CSS framework into the page.
  4. Add these buttons to the toolbar definition:
    • jsplus_bootstrap_button
      Inserting and editing button
    • jsplus_bootstrap_icons
      Inserting an icon (Bootstrap 3 only)
    • jsplus_bootstrap_label
      Inserting text styled as label
    • jsplus_bootstrap_badge
      Insert a badge
    • jsplus_bootstrap_breadcrumbs
      Navigation links
    • jsplus_bootstrap_alert
      Inserting text message
    • jsplus_bootstrap_gallery
      Upload images and insert as gallery
    • jsplus_font_awesome
      Insert Font Awesome icon
    See sample TinyMCE toolbar configuration manual.
  5. Now you can use your installed plugins. Do not forget to sure that browser cache was cleared.