KB User's Guide - Documents tab - New Editor Icon Bar

The editor icon bar is broken up into four sections, this document will review the features in all four sections.


Section One

Formattingtextoptions2.png

  1. Bold - Marks the highlighted text as bold.
  2. Italic - Italicize the highlighted text
  3. Inline classes: (The down arrow reveals a dropdown menu).

    List of Inline feature options

    • KB internal sites only - <span class="kb-class-internal-site">...</span>
      Text visible on internal KB sites only

    • KB external sites only - <span class="kb-class-external">...</span>
      Text visible on external KB sites only

    • KB owner group sites only - <span class="kb-class-ownersite">...</span>
      Embed site specific content anywhere within a KB document (or news item). Site specific content is visible to owner site only even when the document is shared across multiple sites / groups / institutions.

    • KB owner Institution sites only - <span class="kb-class-ownerinstitution">...</span>
      Embed institution specific content anywhere within a KB document (or news item). Institution specific content is visible to owner institution sites only, even when a document is shared across multiple campuses / schools.

    • KB Include doc - <span class="kb-class-include-doc">...</span>
      Embed the body of another document. For more info see KB User's Guide - Documents Tab - IncludeDoc and Dynamic Web Page Content .

    • KB Include news - <span class="kb-class-include-news">...</span>
      Embed the body of a News item into another News items.

    • Code - <span class="fr-class-code">...</span>
      Used to insert fragments of program code, variables, etc. into a document. The code is displayed in a monospaced font (e.g. a font in which all characters are of the same width) surrounded by a gray highlight.

    • Highlighted - <span class="fr-class-highlighted">...</span>
      May be used to highlight text inside of a paragraph, list, or table. Text to which the highlighted element has been added is considered to be particularly relevant in a specific context.

    • Transparent - <span class="fr-class-transparency">...</span>
      The feature name is a misnomer. Text wrapped in this tag will appear in a very light gray color.

  4. Clear formatting - Clears the formatting of a section of text or the entire document. Any formatting applied to the selected text will be removed.

    • *Note - If the formatting was applied by the features found in Section One, then the "Clear Formatting" button will remove formatting. This button will not remove formatting applied using features in Sections 2, 3 or 4.

  5. More Text (click on the icon to reveal the following features )

    • Underline - Underline the highlighted text
    • Strikethrough - Strikethrough the highlighted text
    • Subscript - Create small letters below the text baseline.
    • Superscript - Create small letters above the line of text.
    • Font family - Changes highlighted text to another font family
    • Font size - Changes the font size of highlighted text
    • Text Color - Changes the text color of the highlighted text
    • Background color - Changes the background color of highlighted text
    • Inline style/ Big red or small blue - Changes highlighted text into large red font  color or smaller blue font color


Section Two

Paragraphoptionsall.png
  1. Paragraph Format

    • Normal
      Apply this formatting to paragraph text in your document.
    • Heading 2

    • The <h2> tag in HTML.  The first heading in your document will, ideally, be Heading 2. Heading 1, <h1>, is reserved only for the Title of the document.
    • Heading 3

      The <h3> tag in HTML. The next heading after Heading 2, ideally, will be Heading 3. Skipping heading ranks can be confusing and should be avoided when possible.

    • Heading 4

      The <h4> tag in HTML. The next heading after Heading 3, ideally, will be Heading 4. Skipping heading ranks can be confusing and should be avoided when possible.

    • Preformatted 

      Highlighting text with the preformatted tag, <pre>, displays in a fixed-width font, and it preserves both spaces and line breaks.
      • *Note - Text wrapped with the preformatted tag will be on it's own line (e.g. cannot be placed within a sentence as the text wrapped in the <pre> tag will become its own line).

  2. Ordered list
    Clicking on the ordered list button will prompt the default ordered list style beginning with Arabic numeral 1.

    The down arrow reveals the following ordered list features.

    • Default - list style begins with Arabic numeral 1
    • Lower Alpha - list style begins with lower case a
    • Lower Greek - list style begins with lower case alpha  (α)
    • Lower Roman - list style begins with lower case Roman numeral i
    • Upper Alpha - list style begins with capital A
    • Upper Roman - list style begins with upper case Roman numeral I

  3. Unordered list
    • Default - bullet style defaults to Disc
    • Circle -
    • Disc -
    • Square -

  4. Align Center -

  5. More paragraph (click on this icon to reveal more features)

    • Align left -
    • Align right -
    • Justify -
    • Ordered list -
    • Paragraph Style -
    • Line height -
    • Decrease indent -
    • Increase indent -
    • Quote Increase -
    • Quote decrease -

Section 3

Insertoptions.png
  1. Insert link - Insert a hyperlink to a URL or to KB resources.

    LinktoKB.png

  2. Insert table - Highlight the number of columns and rows  desired for a table. To view the additional table features, click inside a cell of the table you created to reveal:

    table_options.png

    • Table header -
    • Remove table -
    • Row -
    • Column -
    • Table style -
    • Cell - Vertical Split or Horizontal split
    • Cell Background -
    • Vertical Align - Top, Middle, Bottom
    • Horizontal Align - Align left, right, center, justify
    • Cell style - highlighted  or Thick

  3. Insert image - link a URL to an image
  4. Insert Video - Insert a link or embed
  5. More Rich -
    • Emoticons
    • Special Characters
    • Insert Horizontal line


Section 4
misc.PNG

  1. Undo
  2. Redo
  3. Download PDF
  4. Code View
  5. More Misc
    • Full screen
    • Print
    • Select All
    • Help




Keywords:bold italic inline custom class formatting new editor internal external owner group owner institution site restrictions include doc include news code highlighted transparent clear formatting underline strikethrough subscript font family font size text color background color inline style/ Big red or small blue normal paragraph format Heading 2 heading 3 heading 4 h2 h3 h4 preformatted pre ordered list OL unordered UL upper lower alpha greek roman list UL circle square disc align center left right justify paragraph style line height quote increase decrease indent insert link KB link doc link news link topic to the top insert table table header remove table row column table style cell vertical horizontal split cell background vertical align top middle bottom horizontal align insert image insert URL to emoticons special characters insert horizontal line undo redo download PDF code View more miscellaneous misc full screen print select all Help   Doc ID:95474
Owner:Teresa A.Group:KB User's Guide
Created:2019-10-31 10:33 CDTUpdated:2020-03-16 09:41 CDT
Sites:KB User's Guide, Social Science Computing Cooperative
Feedback:  0   0