Using HTML, CSS and JavaScript

You can use most HTML tags in TWiki topics without a problem. This is useful where you want to add some content that is formatted in a way that is not supported using TWiki shorthand, for example, you can write <strike>deleted text</strike> to get ~~deleted text~~.

There are a few usability and technical considerations to keep in mind:

On collaboration pages, it's better not to use HTML, but to use TWiki shorthand instead - this keeps the text uncluttered and easy to edit using the plaintext editor.
If you must use HTML, use XHTML 1.0 Transitional syntax.
Use <literal>..</literal> tags around blocks of HTML to avoid accidental interpretation of TWiki shorthand within the HTML.
Script tags may be filtered out, at the discretion of your TWiki administrator.

Recommendations when pasting HTML from other sources (using the plain-text editor):

Copy only text between <body> and </body> tags.
Remove all empty lines. TWiki inserts <p /> paragraph tags on empty lines, which causes problems if done between HTML tags that do not allow paragraph tags, like for example between table tags.
Remove leading spaces. TWiki might interpret some text as lists.
Do not span a tag over more than one line. TWiki requires that the opening and closing angle brackets - <...> - of a HTML tag are on the same line, or the tag will be broken.
In your HTML editing program, save without hard line breaks on text wrap.

When using a WYSIWYG editor, you can just copy-paste directly into the editor, and the content will be converted to TWiki shorthand automatically when you save.

It is also possible to add Cascading Style Sheets (CSS) and JavaScript code to TWiki pages, which can be used to make TWiki application more interactive. To prevent TWiki from interpreting some text as markup, it can be enclosed in HTML-escaped <pre>-tags.

JavaScript Example: CSS Example:

 <script language="javascript">  </script> 

 <style type="text/css"> /* put your CSS code here */ </style>

JavaScript Example:	CSS Example:
<!-- <pre> --> <script language="javascript"> <!-- // put your JavaScript code here //--> </script> <!-- </pre> -->	<!-- <pre> --> <style type="text/css"> /* put your CSS code here */ </style> <!-- </pre> -->

Related topics: TextFormattingRules, TWikiShorthand

-- Contributors: TWiki:Main/KennethLavrsen, TWiki:Main/PeterThoeny

Revision r5 - 2011-07-07 - 21:48:52 - TWikiContributor Edit