<font size="+3"><b>Text Formatting FAQ</b></font> The most frequently asked questions about text formatting are answered. Also, TextFormattingRules contains the complete TWiki shorthand system on one quick reference page. %TOC% <blockquote> --- ---+++ How do I make a separator? You can make a horizontal separator by entering three dashes at the beginning of a line: =---=. --- ---+++ 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 =%<nop>TOC%= wherever you like on a page (see %TWIKIWEB%.TWikiVariables for more =%<nop>TOC%= options). ----- #TextEnclosed ---+++ Text enclosed in angle brackets like <filename> is not displayed. How can I show it as it is? TWiki interprets text as HTML. The '<' and '>' characters are used to define HTML commands. Text contained in angle brackets is interpreted by the browser if it's a valid HTML instruction, or ignored if it isn't - 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: * =&lt;= = =<= <br /> =&gt;= = =>= * __You enter:__ =(a &gt; 0)= <p /> __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 <nop>JavaScript (the proper spelling!) - prefix the WikiStyleWord with the special TWiki HTML tag =<nop>=: * =<nop>WikiStyleWord= displays as <nop>WikiStyleWord --- ---+++ How can I write fixed font text? The quickest way is to enclose the text in equal signs: * __You enter:__ =Proportional text, <nop>=fixed font=<nop>, proportional again.= <p /> __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 text option to keep the new line of text as is. Enclose the text in <pre> </pre>, or in TWiki's own <verbatim> </verbatim> tags: <pre> This text will keep its format as it is: <verbatim> Unit Price Qty Cost ------- ------ --- ------ aaa 12.00 3 36.00 </verbatim> </pre> The =pre= tag is standard HTML; =verbatim= is a special TWiki tag that also 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: <br> =| cell A1 | cell B1 | cell C1 |= <br> =| 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:__ <pre> <table border="1"> <tr> <th> Head A </th> <th> Head B </th> </tr><tr> <td> Cell A2 </td> <td> Cell B2 </td> </tr><tr> <td> Cell A3 </td> <td> Cell B3 </td> </tr> </table> </pre> __Result:__ <table border="1"> <tr> <th> Head A </th> <th> Head B </th> </tr><tr> <td> Cell A2 </td> <td> Cell B2 </td> </tr><tr> <td> Cell A3 </td> <td> Cell B3 </td> </tr> </table> *3. Use preformatted text with <verbatim> tags* See [[#TextEnclosed]["Text enclosed..."]] --- ---+++ Can I include images and pictures? Yes, this is possible. The easiest way of including images is to attach a GIF, JPG or PNG file to a topic and then to include it with text =%<nop>ATTACHURL%/myImage.gif= . FileAttachment has more. There are actually 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:__ <code> TWiki <nop>%PUBURL%/wikiHome.gif logo.</code> <br /> __Result:__ TWiki %PUBURL%/wikiHome.gif logo. *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. http://www.htmlhelp.com/reference/wilbur/special/img.html has more on inline images. * __You enter:__ <code>TWiki <img src="%PUBURL%/wikiHome.gif" width="46" height="50" /> logo.</code><br /> __Result:__ <br /> TWiki <img src="%PUBURL%/wikiHome.gif" width="46" height="50" /> logo. ----- ---+++ Can I write colored text? Sure. The quickest way is to use the <font color="colorCode"> and </font> tags - they're HTML tags that work in any browser, (although they've been phased in the latest version). You can also use a =style= attribute: =style="color:#ff0000"=, placed in most HTML tags - =span= is an all-purpose choice: "<span style="color:#ff0000">. "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][StandardColor]] names instead of hex code in the =font= tag only): <table> <tr bgcolor="#e0e0e0"> <td><font color="#000000"> *Black:* </font></td><td> ="#000000"= </td> <td><font color="#008000"> *Green:* </font></td><td> ="#008000"= </td> <td><font color="#c0c0c0"> *Silver:* </font></td><td> ="#c0c0c0"= </td> <td><font color="#00ff00"> *Lime:* </font></td><td> ="#00ff00"= </td> </tr><tr bgcolor="#c0c0c0"> <td><font color="#808080"> *Gray:* </font></td><td> ="#808080"= </td> <td><font color="#808000"> *Olive:* </font></td><td> ="#808000"= </td> <td><font color="#ffffff"> *White:* </font></td><td> ="#ffffff"= </td> <td><font color="#ffff00"> *Yellow:* </font></td><td> ="#ffff00"= </td> </tr><tr bgcolor="#e0e0e0"> <td><font color="#800000"> *Maroon:* </font></td><td> ="#800000"= </td> <td><font color="#000080"> *Navy:* </font></td><td> ="#000080"= </td> <td><font color="#ff0000"> *Red:* </font></td><td> ="#ff0000"= </td> <td><font color="#0000ff"> *Blue:* </font></td><td> ="#0000ff"= </td> </tr><tr bgcolor="#c0c0c0"> <td><font color="#800080"> *Purple:* </font></td><td>="#800080"= </td> <td><font color="#008080"> *Teal:* </font></td><td> ="#008080"= </td> <td><font color="#ff00ff"> *Fuchsia:* </font></td><td> ="#ff00ff"= </td> <td><font color="#00ffff"> *Aqua:* </font></td><td> ="#00ffff"= </td> </tr> </table> * __You enter:__ <code> <font color="#ff0000"> Red color </font> draws attention. </code><p> __Result:__ <font color="#ff0000"> Red color </font> draws attention. ----- </blockquote> -- PeterThoeny - 13 Sep 2001 <br /> -- MikeMannix - 14 Sep 2001 <br />
This topic: TWiki
>
TextFormattingFAQ
Topic revision: r9 - 2001-09-14 - PeterThoeny
Copyright © 1999-2025 by the contributing authors. All material on this collaboration platform is the property of the contributing authors.
Ideas, requests, problems regarding TWiki?
Send feedback
Note:
Please contribute updates to this topic on TWiki.org at
TWiki:TWiki.TextFormattingFAQ
.