**Text Formatting FAQ**
The most frequently asked questions about text formatting are answered. Also, [[TextFormattingRules]] contains the complete TWiki shorthand system on one quick reference page.
%TOC%
> ----
>
> ### How do I make a separator?
>
> Create a separator - a horizontal rule - by entering three dashes at the beginning of a blank line: `---`. You can enter more than three if you like, for a more visible separator in edit mode:
`--------------`
>
> ----
>
> ### How do I create a heading?
>
> You can create six sizes of headings - <h1>...<h6> in HTML - by typing, from the beginning of a line, three dashes (-), from one to six plus signs (+), a space, and your heading text. The FAQ questions on this page are created with: `---+++ Have a question?`.
>
> * You can insert a nested table of contents, generated from headings, by placing %TOC%
wherever you like on a page (see %TWIKIWEB%.TWikiVariables for more %TOC%
options).
>
> ----
>
>
>
> ### Text enclosed in angle brackets like <filename> is not displayed. How can I show it as it is?
>
> TWiki interprets text as HTML, and the '<' and '>' characters define where HTML commands start and end. Text _inside_ angle brackets is treated as HTML, and ignored if it doesn't actually do anything - either way, the brackets and its contents are not displayed.
>
> If you want to display angle brackets, enter them as HTML codes instead of typing them in directly:
>
> * `<` = `<`
`>` = `>`
>
> * **_You enter:_** `(a > 0)`
> **_Result:_** `(a > 0)`
>
> ----
>
> ### Some words appear highlighted, with a "?" link at the end. How can I prevent that?
>
> A question mark after a word is a link to a topic that doesn't yet exist - click it to create the new page. This is a TWiki feature - typing a [[MeaningfulTitle]] in a comment is an invitation for someone else to add a new branch to the topic.
>
> To prevent auto-linking - say you want to enter a word like JavaScript (the proper spelling!) - prefix the [[WikiStyleWord]] with the special TWiki HTML tag ``:
>
> * `WikiStyleWord` displays as WikiStyleWord
>
> ----
>
> ### How can I write fixed font text?
>
> The quickest way is to enclose the text in equal signs:
>
> * **_You enter:_** Proportional text, =fixed font=, proportional again.
> **_Result:_** Proportional text, `fixed font`, proportional again.
>
> ----
>
> ### Text I enter gets wrapped around. How can I keep the formatting as it is?
>
> TWiki interprets text as HTML, so you can use the `preformatted` HTML option to keep the new line of text as is. Enclose the text in <pre> </pre>, or in TWiki's own <verbatim> </verbatim> tag:
>
> This text will keep its format as it is:
>
> Unit Price Qty Cost
> ------- ------ --- ------
> aaa 12.00 3 36.00
>
>
> The `pre` tag is standard HTML; `verbatim` is a special TWiki tag that forces text to fixed font mode, and also prevents other tags and TWiki shortcuts from being expanded.
>
> ----
>
> ### How do I create tables?
>
> There are three possibilities:
>
> 1. Use Wiki rule with "|" vertical bars.
> 2. Use HTML tables with <table>, <tr>, <td> tags.
> 3. Use preformatted text with <verbatim> tags.
>
> **1\. Use Wiki rule with "|" vertical bars**
>
> * Example text:
`| cell A1 | cell B1 | cell C1 |`
`| cell A2 | cell B2 | cell C2 |`
> * Example output:
>
> cell A1 |
> cell B1 |
> cell C1 |
>
>
> cell A2 |
> cell B2 |
> cell C2 |
>
>
>
> **2\. Use HTML tables with <table>, <tr>, <td> tags**
>
> This is a manual process using HTML commands.
>
> **_You enter:_**
>
>
>
> Head A | Head B |
>
> Cell A2 | Cell B2 |
>
> Cell A3 | Cell B3 |
>
>
>
> **_Result:_**
>
>
>
> Head A |
> Head B |
>
>
> Cell A2 |
> Cell B2 |
>
>
> Cell A3 |
> Cell B3 |
>
>
>
> **3\. Use preformatted text with <verbatim> tags**
>
> See "Text enclosed..."
>
> ----
>
> ### Can I include images on a page?
>
> Yes. The easiest way is to [[FileAttachment]] a GIF, JPG or PNG file to a topic and then to place it with: %ATTACHURL%/myImage.gif
. This works only for the page that the image is attached to.
>
> To place an image on any page, ther are two ways of including inline images.
>
> **1\. Using URL ending in .gif, .jpg, .jpeg, .png**
>
> This is a simple and automatic way of including inline images. Simply write the URL of the image file, this will create the inline image for you. **_NOTE:_** The images must be accessible as a URL.
>
> * **_You enter:_** TWiki %PUBURL%/wikiHome.gif logo.
**_Result:_** TWiki %PUBURL%/wikiHome.gif logo.
>
> You can upload images directly to your server with FTP access. You can also [[FileAttachment]] image files to a topic - you could even create a dedicated image topic, like `ImageLibrary` - and then link to the images directly:
>
> * Attach `pic.gif` to `Someweb.SomeTopic`
Display with %PUBURL%/Someweb/SomeTopic/pic.gif
>
> **2\. Using <img> tag**
>
> This is a manual process where you have more control over the rendering of the image. Use the <img> tag of HTML to include GIF, JPG and PNG files. **Note:** The display of the topic is faster if you include the `WIDTH` and `HEIGHT` parameters that have the actual image size. has more on inline images.
>
> * **_You enter:_** `TWiki logo.`
**_Result:_**
TWiki logo.
>
> ----
>
> ### Can I write colored text?
>
> Sure. The quickest way is to go <font color="colorCode">colorize</font> - `font` is an HTML tag that works in any browser, although it's been phased out in the latest HTML specs.
>
> You can also use the up-to-date `style` attribute - ex: `style="color:#ff0000"` - placed in most HTML tags. `span` is an all-purpose choice: "<span style="color:#ff0000">CoLoR</span>. Only old (like 3.x IE & NS) browsers have a problem with `style`.
>
> "colorCode" is the _hexadecimal RGB color code_, which is simply Red, Green and Blue values in hex notation (base 16, 0-F). For pure red, the RGB components are 255-0-0 - full red (255), no green or blue. That's FF-0-0 in hex, or "#ff000=" for Web page purposes. For a basic color selection (you can [[StandardColors]] names instead of hex code in the =font
tag only):
>
>
>
> Black: |
> "#000000" |
> Green: |
> "#008000" |
> Silver: |
> "#c0c0c0" |
> Lime: |
> "#00ff00" |
>
>
> Gray: |
> "#808080" |
> Olive: |
> "#808000" |
> White: |
> "#ffffff" |
> Yellow: |
> "#ffff00" |
>
>
> Maroon: |
> "#800000" |
> Navy: |
> "#000080" |
> Red: |
> "#ff0000" |
> Blue: |
> "#0000ff" |
>
>
> Purple: |
> ="#800080"= |
> Teal: |
> "#008080" |
> Fuchsia: |
> "#ff00ff" |
> Aqua: |
> "#00ffff" |
>
>
>
> * **_You enter:_** ` Red color draws attention. `
> **_Result:_** Red color draws attention.
>
> ----
-- [[PeterThoeny]] - 13 Sep 2001
-- [[MikeMannix]] - 14 Sep 2001