Skip to content

Latest commit

 

History

History
73 lines (53 loc) · 2.16 KB

File metadata and controls

73 lines (53 loc) · 2.16 KB

Enhanced Code Editor plugin

Tip
As of {productname} 7.0, the Advanced Code Editor plugin has been renamed to Enhanced Code Editor. When adding Enhanced Code Editor in your editor, continue to use advcode.

The Enhanced Code Editor plugin (advcode) brings a more advanced code editor to {productname}. This code editor makes it easier to modify the HTML, and is a useful add-on for power users. It comes with features often found in IDEs, all enabled by default:

  • Syntax color highlighting.

  • Bracket matching.

  • Code folding.

  • Multiple selections/carets.

  • Search and Replace.

  • Dark or light mode button for code display.

  • Increase and decrease display font size buttons.

  • Full-screen mode button.

Note
For the Enhanced Code Editor to offer a full-screen mode requires the Full screen plugin and requires Enhanced Code Editor to be running in inline mode.

The difference between the Code and Enhanced Code Editor plugins

liveDemo::advcode[]

Example: basic setup

tinymce.init({
  selector: 'textarea',  // change this value according to your HTML
  plugins: 'advcode',
  toolbar: 'code'
});

Example: enable the Enhanced Code Editor full-screen mode button

tinymce.init({
  selector: "textarea",  // change this value according to your HTML
  advcode_inline: true,
  plugins: [
    "fullscreen", "advcode",
  ],
  toolbar: "code"
});

Commands

The Enhanced Code Editor plugin provides the following {productname} command.