Editing Text

Our site uses a flexible WYSIWYG text editor called TinyMCE.

TinyMCEIn principle you can use any HTML features with the editor, including the use of any fonts or colors that you want.

Please don’t do that.

Our site has a “theme” with its own fonts and color scheme, which is intended to provide a consistent look on all pages. If you use different fonts and colors, even if you think they look good with the current theme, they probably won’t look good if we change the theme.

The rule is: don’t specify fonts and colors. Let the theme choose them.

This still leaves you with lots of formatting options. The editor lets you pick from a number or paragraph and character styles which will automatically be displayed according to the rules of the current theme.

The TinyMCE editor doesn’t know what fonts and colors the current theme uses and just displays defaults. To see how your text will look in the current theme, click the “Preview” button on the upper right of the editing page.

Sample Post in Theme

Block Styles

Block styles affect the entire current paragraph.

Block Styles

The Format dropdown lets you select from “Paragraph” (normal text), “Heading 1” through “Heading 6”, “Address” and “Preformatted” (which generally looks like typewritten text).

The quotation icon sets the “block quote” style which is appropriate for quotations.

The “left” icon left-justifies the text.

The “center” icon centers the text.

The “right” icon right-justifies it.

The “full” icon adds spaces to justify on both the left and right margins. Though it looks pretty it tends to look make long blocks of text less readable, so it should generally be avoided. It is particularly problematic on lower-resolution screens.

Character Styles

Character Styles

Character styles apply to characters within a paragraph. You either:

  • Press the button, type some text, then press the button again when you are done, or
  • Select some text and press the button.

The supported styles are bold, italic, strike-through, underline, subscript and superscript.

Lists and Indentation

Lists and Indentation

The list buttons create bulleted or numbered lists. These should always be used rather than typing your own numbers at the beginning of a paragraph. These can be combined with the left- or right-indent buttons to create nested lists.

  1. List item 1.
    • Something about that item.
      • And furthermore…
    • Something else about the item.
  2. List item 2.
  3. List item 3.

Search and Replace

Search Replace

The Search and Replace buttons do just what you would expect.

Other Editing

Misc Buttons

The “Insert More Tag” button inserts a conditional “Read more…” link that appears when the post is displayed on a summary page. Put this after the first or second paragraph of a long post.

The “Non-breaking space” button inserts something that looks like a space character but which cannot be broken across lines.

The “Break” button inserts a line break without starting a new paragraph. This is very useful when formatting block quotes.

The “Eraser” button removes all formatting from the selected text.

Adding Links

Link buttons

To add a hyperlink select some text and press the “Link” button. You will be prompted to enter a hyperlink and an optional title that will be displayed when the mouse hovers over the link.

The “Unlink” button removes a hyperlink from the selected text.

Pasting Text

Pasting Buttons

If you copy and paste in text from a word processor, or from another web site, it will probably already contain formatting including font and color specifications. Of course we don’t want that because it will override our theme.

There are two ways around this:

  1. Use the “Paste as Plain Text” button. This will strip out all formatting (but it may add extra paragraph breaks.)
  2. Use Control-V to paste in the text with formatting. Then use Control-A to select all the text and click the Eraser button to remove all the formatting.

Then go through the text and use the buttons described above to add the formatting you want.


Add a Comment

This site uses Akismet to reduce spam. Learn how your comment data is processed.