Show/Hide Block Elements

Overview

The Show/Hide Block Elements icon on the WYSIWYG Toolbar enables the ability to toggle the view of the WYSIWYG Editor. Click the icon to show the view or to hide it. Toggling displays block elements encapsulated within rectangles defined with thin, dashed lines and identifies them with the label of the HTML element being used.

Classic Editor

Show Elements Icon in Classic

JustEdit

JustEdit Show Elements Icon

Using Show/Hide Block Elements

The encapsulation rectangles show the applied format element. For example, a "P" label identifies the paragraph element, <p></p>, and "HGROUP" represents the application of a Heading Group.

Styling can be applied by using the Format or the Styles drop-down; however, only elements listed on the Format drop-down are shown in the block element view. The Styles drop-down applies classes. Elements listed on the Format drop-down are built-in; elements listed on the Styles drop-down can be added to reflect what has been defined in a style sheet. The list available on the Format drop-down also depends upon the schema used. For example, when enabling HTML5 Schema for a site, the following are available on the Format drop-down:

  • Paragraph
  • Address
  • Pre
  • H1 – H6
  • Block Quote
  • Section
  • Article
  • Heading Group
  • DIV
  • Aside
  • Figure

When HTML5 Schema is not enabled, the WYSIWYG defaults to XHTML. The following are available on the Format drop-down:

  • Paragraph
  • Address
  • Preformatted
  • H1 – H6

In both cases, when the Show/Hide view is toggled to show, the corresponding block elements are shown in the encapsulated and labeled view.

For more information about the Format drop-down and the usage for HTML5 Schema, visit the Format Drop-Down page.

Example of Show/Hide Block Elements

Show Hide Block Elements

Show Elements in JustEdit