Skip Navigation and go straight to the main content or use use accesskey "s"
NAAIDT
Author: NAAIDT

Text boxes in the new NAAIDT Online will automatically create web or email links and certain HTML tags can also be used to enhance the presentation of an article.

The new NAAIDT Online CMS defaults to enable web pages to be produced by typing directly into the WYSIWYG text boxes. The required HTML code is then generated automatically. More experienced contributors, however, may wish to choose the Raw HTML option and control the code themselves.

Always check the HTML code you produce by using the Validate HTML link provided and make any corrections indicated before posting

Return to new NAAIDT Online - User Guide


Including web links

Text boxes in the new NAAIDT Online will automatically create web or email links and the target will open in a new window. - e.g. typing in www.naaidt.org.uk or http://www.naaidt.org.uk is all that is required.

Linking to another article in the new NAAIDT Online is facilitated by provision of the yourtext code provided for each article.

For example, the Id number for this article is 32 so to link to here the code would be adapted to Link:32,Link back to here - ie Link back to here

HTML tags

For more experienced users some HTML tags (Hyper-Text Mark-up Language) can also be included. For example to use a link word other than the URL you would use the <a href="URL">displayname</a> tags as follows:

<a href="http://www.naaidt.org.uk">NAAIDT </a> to make NAAIDT the link word.

If you wish the web site to open in a different window you would use the target="_blank" addition - e.g.
<a href="http://www.naaidt.org.uk" target="_blank">NAAIDT</a> (note the space before the work 'target' and underscore before 'blank').

Enhancing text

Text can be enhanced by use of sub-headings, embolden and italics.

To create a sub-heading use the <h3> tag as follows: <h3>Sub-heading</h3> (note the need always to close a tag by using the tag preceded with a forward slash). A sub-heading with top and bottom rules is created using the <h4> tag as follows: <h4>Sub-heading</h4> Other headings from <h2> to <h6> may be used - the larger the number: the smaller the heading and each heading automatically appears on its own line.

To embolden text use the <strong> tag (although the outdated <b> tag may also be used) as follows:
<strong>this text will be bold</strong>

Italic text is created using the <em> tag (although the outdated <i> tag may also be used) as follows:
<em>this text will be in italics</em>

Tags can sometimes be nested to create multiple effects - eg
<em><strong>this text will be in bold italic</strong></em>

Including Lists

Either numbered lists or bulleted lists can be included as follows:
Ordered list (ol):Unordered list (ul):
<ol><ul>
<li>first numbered list item</li><li>first bulleted list item</li>
<li>second numbered list item</li><li>second bulleted list item</li>
<li>etc .etc ...</li><li>etc .etc ..</li>
</ol></ul>

(note the need to close all tags, including the list item, <li> tags)

This code will produce:

Ordered list (ol):

  1. first numbered list item
  2. second numbered list item
  3. etc .etc ...

Unordered list (ul):

  • first bulleted list item
  • second bulleted list item
  • etc .etc ...

Other tags may be allowed and a more complete explanation of using html can be found at http://www.dialsolutions.com/htmlcourse/

See also the XHTML tutorial from W3 Schools at http://www.w3schools.com/xhtml/default.asp

Adding style

Users who have a particular interest in creating web pages should become familiar with the use of Cascading Style Sheets.

Styles sheets define HOW HTML elements are to be displayed, such the font type and the color. Styles are normally saved in external .css files, where a single change can affect a whole web site, but can also be used inline - e.g. the red 'new' in new NAAIDT Online is created by the inline code:
<span style="color: red; font-style:italic;">new</span>

Styles are the future for good web page design. Use of HTML should be restricted to WHAT a web page element is to convey and styles should dictate HOW it is conveyed. For example, use of the HTML tag <h3> throughout this web site determines only that a heading should be displayed: it is the style sheet that dictates its size, colour, indentation and the fact that it is preceded by a green bullet.

For further information see http://www.dialsolutions.com/htmlcourse/ and the CSS tutorial from W3 Schools at http://www.w3schools.com/css/default.asp

Caution! Using both HTML and CSS carelessly can have unpredictable effects on the whole web site - ALWAYS use the Validate HTML link provided to check for errors


Article classifications
Target Audience
Public

Submitted by: Geoff Howard Email: geoff@geoffhoward.net
Publication date: 12th March 2008 Withdrawal date: ---
Created: 12th March 2008 Last updated: 01st April 2008 15:11
Persistent link to this article:http://www.naaidt.org.uk/32