Install Bootstrap Tools to TinyMCE
Note. By default TinyMCE stripes out some tags and attributes. Please add this option to your initialization script:
extended_valid_elements : "div[*],span[*],i[*]",
- Unpack archived files directly to
tinymce/plugins. - Turn on the plugin in
initialization script:
plugins: 'jsplusInclude,jsplusBootstrapTools' -
Specify framework (Bootstrap or Foundation) for Include CSS/JS add-on:
jsplusInclude: { framework: "b3" // or "b4", "f5", "f6", "f6x" }b3means 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. - Add these buttons to the toolbar definition:
Show Bootstrap structurejsplusShowBlocks
Edit the containerjsplusBootstrapToolsContainerEdit
Add a container at cursorjsplusBootstrapToolsContainerAdd
Add a container beforejsplusBootstrapToolsContainerAddBefore
Add a container afterjsplusBootstrapToolsContainerAddAfter
Delete the containerjsplusBootstrapToolsContainerDelete
Move the container upjsplusBootstrapToolsContainerMoveUp
Move the container downjsplusBootstrapToolsContainerMoveDown
Edit the rowjsplusBootstrapToolsRowEdit
Add a row at cursorjsplusBootstrapToolsRowAdd
Add a row beforejsplusBootstrapToolsRowAddBefore
Add a row afterjsplusBootstrapToolsRowAddAfter
Delete the rowjsplusBootstrapToolsRowDelete
Move the row upjsplusBootstrapToolsRowMoveUp
Move the row downjsplusBootstrapToolsRowMoveDown
Edit the columnjsplusBootstrapToolsColEdit
Add a column at cursorjsplusBootstrapToolsColAdd
Add a column beforejsplusBootstrapToolsColAddBefore
Add a column afterjsplusBootstrapToolsColAddAfter
Delete the columnjsplusBootstrapToolsColDelete
Move the column leftjsplusBootstrapToolsColMoveLeft
Move the column rightjsplusBootstrapToolsColMoveRight
- Now you can use your installed plugins. Do not forget to sure that browser cache was cleared.

Buy in bundle