A Somewhat-Complete List of HTML Allowed in Journals

Okay folks -- as promised, here's my entry on the allowed HTML tags that you can use in your Journal entries (and All About Me areas).

(As you'll recall, this was one of the items from my April "pending entries" file that you voted on last week.)

Before I get started, even the partial set of HTML that Journals supports can get you in trouble (for example, I've seen people who've accidentally hidden their Edit buttons because they added some bad HTML), so if you're going to play around with HTML, it's probably a good idea to set up a separate test Journal.

Now, HTML is basically the bits of code that controls how Web pages look, where the links go, how to format the text, etc.

In AOL Journals, the HTML code is typically hidden; if you want to see some of the HTML that sits beneath the surface, when you're editing or creating an entry, look in the formatting toolbar -- there's a pulldown menu that usually says "Text" -- it shows you the rich text view of the page -- the bolds are bold, the hyperlinks are blue underlined text, etc:

Here's a sample bit of an entry in Text view.

When you change the pulldown to "HTML", it will show you the HTML view, exposing the tags that are normally hidden from view:

AOL Journals HTML View
The same bits in HTML view.

If you want to edit the HTML of your entries, you need to be in HTML view -- if you try adding HTML while you're in text view, it's not going to be recognized as code, and will show up in your published entry.

Okay, so, this entry won't be a full-on HTML tutorial; the list of free Web resources on HTML is as long as your arm, so do a search or check this list of beginner HTML tutorials from the Open Directory. (It's a long list -- personally, I start out with the Bare Bones Guide to HTML, though youshould find the one you like best.)

Supported HTML Tags in AOL Journals

I went to the Journals tech folks and asked them, "What HTML tags does Journals support?" In a nutshell:

Not Allowed:

No Frames -- Exception: IFRAMES (embedded frames) are okay, but the IFRAMEd content has to be on our whitelist
No Javascript (Exception: Javascript from Web sites on our whitelist is okay) and no OBJECT (embedded object tags, so no embedded movie players, for example)
No H1/H2/H3-style headines or Hard Rule (HR) tags
No Forms

Allowed:

Tables (Support for HTML Table tags was added June, 2006)
Structure tags like paragraph, div and span (with the usual modifiers)
HTML formatting tags -- bold, italic, underline, blockquote, break, etc. (we don't have ~~strikethrough~~ [7/31 Update: Okay, it looks like we now have strikethrough] or blink)
Font Size/Type Tags
Ordered, Unordered and Definition Lists (this is an unordered list, for example)
Hyperlinks (including modifiers like target="_blank/_top/_new")
Embedded Images (using the <img> tag and modifiers like border and align)
Embedded CSS (Style Sheets)
To center something, use something (not <center></center> -- this won't work)

The List of Tags:
<a></a> (used to form a hyperlink or anchor)
bold
italic
underline
<strike>~~strikethrough~~</strike>
paragraph element (use with modifiers like align=center)
emphasis (basically italic)
strong (pretty much bold)
_subscript
superscript (note: this doesn't seem to work)
 break tag (breaks the text to a new line)
<ul>unordered list</ul> (a bulleted list)
<ol>ordered list</ol> (a numbered list)
<li>list item</li>
<dl>definition list</dl> (I admit it, I've never used this)
<dt>term in a definition list
<dd>definition in a definition list
font (use with modifiers like size, style, face, etc.)
span
<div>div</div>
<img>
<blockquote>blockquote</blockquote> (indents a block of text, kind of useful)
<abbr>abbreviation</abbr>

You can also use the coded character set, so   is a non-breaking space (a row of non-breaking spaces together won't break to the next line), © is the © sign, ¶ is the ¶ sign, etc.

This list is just a starting point -- I haven't gone into all the modifiers for the existing tags, or how you actually use them. Also, embedded CSS gives you a whole world of options if you really want to cause some trouble. So this here is just a start.

If you have questions about specific tags, post a comment and I will keep updating this entry (and eventually link it from my sidebar, with all the other helpful stuff).

Fiddling with the HTML is a little more involved than working with the rich text, but it does give you more control over how the page looks and what it does, so it can be worth it if you spend some time learning it.

Also, if you have no idea what any of this means, don't worry -- the next generation of editing tools will hopefully mean you won't have to know any of this (but it never hurts to know, anyway.)

Thanks -- Joe

Tag: AOL Journals

Written by journalseditor Blog about this entry

This entry has 17 comments: (Add your own)

#17 Comment from journalseditorEntry Author
4/16/07 11:13 AM | Permalink

Brian -- that's kind of funny (and I must admit, a little perverse to me), since the pre tag (as designed) always meant a fixed-width font (where each letter is exactly the same width, like a typewriter). But whatever works, works. Thanks -- Joe (posted & mailed)
#16 Comment from thinkinglizard
4/15/07 3:07 PM | Permalink

Greetings Joe,

The <PRE> tag has been most useful in that it allows me to begin lines
any number of spaces in from the left margin. Therefore, I usually
use the following tags:
<PRE>
at the top of each entry and
</PRE>
at the bottom of each entry.
Using <PRE> also keeps lines single-spaced.
I do sometimes use more than one font,
add COLOR, and/or change a font's size.
I learned this from a tutorial. --- Thank you for your information.
-
Brian Salchert thinkinglizard
#15 Comment from sepintx
5/13/06 12:39 AM | Permalink

Thanks Joe!
#14 Comment from fisherkristina
5/12/06 3:56 AM | Permalink

Thanks.

Krissy
http://journals.aol.com/fisherkristina/SometimesIThink
#13 Comment from journalseditorEntry Author
5/10/06 1:16 PM | Permalink

To answer a few other items:

* I'm not sure why tables were excluded, though I would guess it's because you can do some real damage with table code -- malformed or incorrect table tags in an entry can blow up your entire Journal's layout.

* Strikethrough was not a widely supported HTML tag (and has in fact been deprecated -- http://www.w3.org/TR/html401/conform.html#deprecated ) -- if you want to use it, you can do it using CSS -- this code should work (though not in the comment):
strikethrough text</a>

* Sup renders in the browser, but gets stripped out. Not sure why.

* If you don't know what any of this means, you'll probably want to check out a basic HTML tutorial -- here is a bunch of them that come up in search. The basic stuff is not that hard, honestly, it's just a way of marking up text, using tags, so it looks and acts the way you want it to:
http://search.aol.com/aolcom/search?query=basic+html+tutorial

Thanks -- Joe

Show all comments (12 more)

AOL Journals: Magic Smoke Public Journal
Back to Journal	Archives \| Alerts x Entry Alerts Comment Alerts \| Feeds

AOL Journals: Magic Smoke

A Somewhat-Complete List of HTML Allowed in Journals