HTML pages

One of the most frequently used node types is the nodes:htmlDiv. It represents an HTML page, more exactly speaking a DIV element, that makes up the body of the page. A DIV element has been used to allow to include the page into virtual pages, see later.

An HTML page looks like

As in the default view, we have a menu and a toolbar. The toolbar has some additional actions:

  • Edit. Edit the page, the same can be achieved by the menu.
  • Printable version. This will show only the content of the page for printing.
  • Book. This will generate either an EPUB file with this page and all pages referred to from this page or a zipped set of HTML pages, provided they are part of the tree below the current page. Note, that unlike in a filesystem, HTML pages in nodes may have sub nodes. This will reduce the number of folders used only to structure the content, but with no visual information otherwise.

Please compare as well the corresponding use case.

To modify the page, you start the editor integrated in the browser, either by the toolbar icon or the menu:

The editor has

  • A menu bar in addition to the browser menu bar.
  • A toolbar with frequent actions.
  • An explorer panel, that shows the structure of the page.
  • A content panel with the page content.

The toolbar is only used to facilitate the most frequent actions. All toolbar actions can be invoked as well from the menu, so we will only describe the menu here.

The menu has five components:

  • Page. This allows to exit the page with or without saving. In addition, a comment may be entered when saving.
  • Edit. The usual editor actions.
  • View. This allows to change the view. The topmost part can be used to change the explorer panel from heading to the HTML element tree. The lower part can switch between displaying the HTML view and the HTML code created by the editor.
  • Paragraph. Here you can create lists, common paragraph types like headings, character styles like bold etc. You can add a style to current selected element, i.e. add a CSS class or id to the element. The class or id will be selected from the CSS classes and ids available to the page. To add CSS stylesheets to the page, you must add the stylesheet to the path denoting the page using the New action of the default view. You can insert a page having a component editor, this will be edited embedded in the current page.
  • Table. This can be used to create and edit a table.

Please compare as well the use case for the HTML view.

Components

Edit an HTML page within another HTML or virtual page ...