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/)
| reply |
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! )
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):
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 …
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!
| ) |
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! |
i'm not sure why one would ever want to use such a frame in a blog , but for what it's worth, it was done with <fieldset><legend align="center"><b>smilies:</b></legend> before and </fieldset> after
oh, i almost forgot …
cheers!
To get more from opinion, click here to sign up for our free Editor's Picks newsletter.
blue text: