New Froala Editor v5.0.0 is here – Learn More
Froala Documentation
- Froala Docs
- /
- Plugins
- /
- Code View Plugin
Code View Plugin
Plugins are fully functional during your trial once you've added your trial key to the setup.
Enables view and edit of the HTML code behind the content.
Code view button is displayed by default under the More Misc menu
Plugin options:
| codeViewKeepActiveButtons Array - Default: ["fullscreen"] |
A list of buttons to keep active while the editor is in Code View mode. |
Plugin methods:
| codeView.isActive () returns: Boolean |
Find if code view mode is active. |
| codeView.get () returns: String |
Get the HTML edited inside the code view mode. |
| codeView.toggle () returns: Object |
Toggle between the code and text view. |
Plugin events:
| codeView.update () . |
Triggered when the code view is changed |
Add Plugin to your code:
Plugin name: codeView
Plugin JS Script: ../js/plugins/code_view.min.js
Or from CDN https://cdn.jsdelivr.net/npm/froala-editor@latest/js/plugins/code_view.min.js
Plugin CSS link: ../css/plugins/code_view.min.css
Plugin CSS link https://cdn.jsdelivr.net/npm/froala-editor@latest/css/plugins/code_view.min.css
Dependence :
For the plugin to work properly, You need to include the following CodeMirror 5 scripts and stylesheets in your web application before Froala script files
<script src="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.3.0/codemirror.min.j"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.3.0/mode/xml/xml.min.js"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.3.0/codemirror.min.css" />
