Textbox.io includes the ability for users to directly edit HTML via code view. This provides power users with more flexibility over the content they create and includes features such as automatic tag completion and matching.
When enabled, the user can toggle between code view and design view by clicking on the icon in the bottom right corner of the editor container
Editor container with code view enabled. The user can toggle between code and design views by clicking the icon in the bottom right corner.
Code view is only available in classic mode and is enabled by default.
Switching between code view and design view programmatically
The Textbox.io API provides functionality to toggle between code and design views via
Hiding the code view button
If you wish to switch between code view and design view programmatically, you may wish to disable the code view button. To disable the code view button but leave the code view feature enabled, set the
codeview.showButton property to
Disabling code view
When you disable the code view feature, the button is also removed from the Textbox.io UI.
Toggling between code and design views triggers filter logic (both external and potentially via plugins) to be executed on editor content. This is necessary to sanitize content and remove superfluous UI (such as spelling underlines, etc) from content when switching.
Logic is as follows:
- Switching from design to code view - code view's content is run through the
- Switching from code view to design view - the design view's content is run through the
See Filtering Content for more information on content filtering.