goldfishy guide < html for guppies >

html for guppies:

there's no official html guide on thejc.com, so here's a few hints, and some codes for you to copy-and-paste onto a file on your own computer

(a very useful guide to html (with a try-it-yourself facility) can be found at http://www.w3schools.com/html/)

comment:

all html codes must begin and end with angled brackets (< and >)

previewing your blog or comment:

there's no preview facility on the blog itself, but you can use the preview facility on the private message part of the website …

bookmark http://www.thejc.com/privatemsg/msgto (it only works if you're logged-in!

), type your name as the addressee, anything as the subject (i suggest the title of the blog, if you want to save the comment as a separate message), your draft comment in the message box, and click the "preview" button

(and if you actually click the "send" button, no harm's done … you've only sent it to yourself!

)

tags to rememmber:
i tags (eg <i>italic text</i> gives you italic text)

b tags (eg <b>bold text</b> gives you bold text)

small tags (eg <small>small text</small> gives you small text)

big tags (eg <big>big text</big> gives you big text)

h6 tags (eg <h6>a small heading</h6> gives you

a small heading

h4 tags (eg <h4>a big heading</h4> gives you

a big heading

(other sizes, such as h5, do not seem to be available on these blogs)

quotes:

to quote some text, put it between blockquote tags, eg <blockquote>some text</blockquote> gives you

some text

clickable links:

to turn some text into a clickable link, put <a href="http:www.etc"> before the text, and </a> after, eg <a href="http://www.thejc.com">this text is clickable</a> gives you this text is clickable

but a web address is automatically clickable … just type it (eg http://splurge ), and the jc's computer makes it a clickable link!

you can combine the previous two methods to quote some text and begin the quote with a clickable link, as follows:

to quote from a comment on the same page:

copy-and-paste the following before the text (and </blockquote> after the text):

<blockquote><span class="user_name"><a title="click here for original quote" href="#comment-12345 "><small>happygoldfish : </small> </a></span>

but inserting the blogger's name instead of mine, and the actual comment number instead of 12345 (you can find that number by hovering your mouse over the word "reply" at the bottom of the comment, and looking at the status bar at the bottom of the window)

eg <blockquote><span class="user_name"><a title="click here for original quote" href="#comment-12345"><small>happygoldfish: </small> </a></span>all html codes <i>must</i> begin and end with <i>angled</i> brackets (< and >) </blockquote> gives the comment with a clickable link on the name:

happygoldfish: all html codes must begin and end with angled brackets (< and >)

to link to the original blog, type "#content-header" instead of "#comment-12345":
<a href="#content-header">

to link to a different blog, you'll need to type the site url of the blog (ie, everything from the "/" after "thejc.com") before the #, eg <a href="/blogpost/israeli-oranges-iran#comment-12345">

indenting:

to slightly indent text, place it inside a table with only one cell, but with a cellspacing of 10, eg:

<table cellspacing="10"><tr><td>this text is indented 10 points</td></tr></table> gives you:

this text is indented 10 points

alternatively, place it inside the second cell of a table, with the first cell empty but with a width of 10 points, eg:

<table ><tr><td width="10"></td><td>this text is indented 10 points</td></tr></table> gives you:

this text is indented 10 points

centreing:

there are two ways of centreing text:

i] the simple and obvious way is to type <div align="center"> before and </div> after … unfortunately, i have found this unreliable: it does not always give the desired result, and sometimes the appearance on the preview is not the same as on the blog itself: so instead i prefer …

ii] centreing a short line of text (or slightly indenting several lines) can be achieved by putting the text into a table with centre-aligned cells, eg: <table align="center" cellspacing="10"><tr><td>this text is centred</td></tr></table> gives you:

this text is centred

(nb: "cell-spacing="10"" is needed to prevent the table from getting too close to the following line)

(several lines will be slightly indented, but still left-aligned within the table … to centre several lines reliably, use method i] inside method ii])

(you can also right-align by typing "right" instead of "center"!)

red text:

place <span class="messages error"> before and </span> after to produce red text, eg <span class="messages error">this text is <i>red!</i></span> gives you:
this text is red!

(this also works with p or td instead of span, but not with div, which for some reason produces instead …

black text in a long pink box!

but if you place it in a cell of a table, that cuts the box to size … eg, <table><tr><td><div class="messages error">black text in a <i>snug!</i> pink box!</div></td></tr></table> gives you:

black text in a snug pink box!

)

blue text:

place <span class="user_name"><a><small> before and </small></a></span> after to produce blue text, eg <span class="user_name"><a><small>this text is <i>blue!!</small></a></span> gives you:
this text is blue!!

(this also works with p div or td instead of span)

(unfortunately, the blue text is underlined, and goes black if you place the mouse over it … i don't know how to avoid that

… the blue isn't underlined in message-preview

)

and mixed
text:

this is red

this is black

in a pink box

this is blue

this is red again!

smilies:
smilies are not officially provided for on these blogs, but you can produce them by copy-and-pasting:
<img src="/files/imagecache/simchach_galleria/smile .gif"> gives you

and replacing the word "smile" by other words gives you other smilies, as follows:

wink

confused

frown

redface