Since the Rich Text editor on Livejournal goes insane frequently and messes things up and drives everyone nuts, here are some basic HTML codes for use when posting on Livejournal in the HTML Editor.
Basic formatting tags:
This is italicized
This is italicized
This is bold
This is bold
This is underlined
This is underlined
This is centered
This is centered
All of these can be used together in any combination.
Like so.
Like so.
It’s generally a good idea to close the tags in the reverse order they went on, but I’m not sure how fussy the LJ HTML editor is about that.
This is small text
This is small text
This is big text
This is big text
These can’t be used together (I don’t think. They’d cancel each other out) but can be used with any or all of the above. They can also be ‘stacked’, used multiple times to make text really tiny or really huge, but make sure there is a close-tag for each time the tag is used or the rest of your text will have its size altered as well.
If there is a bunch of formatted text you re-use frequently (i.e. fanfic headers) once you’ve done them the way you want them in one post, you can copy and paste them from that post and just change the bits that need changing. Or, if you're more organized than I am, you can set up a special Notepad or other text editor file with your commonly used blocks of HTML formatted stuff without any individual story/etc content, and copy it fresh each time for less risk of forgetting to change something from an old story/etc.
Other codes you will likely need.
This text is hidden under the cut.
This text was hidden under the cut.
(If the remainder of your document is to be under the cut, you don’t need to put in the closing tag. If you have multiple cuts in your post, the closing tag needs to be put in at the end of each cut section, or the other cuts won’t show up, like this one didn’t, since it is inside a larger cut.)
[usernameThis makes an LJ username a link to their page, like so:
caffienekittyThere is no closing tag for this code.
This is a link.This is a link. This is a graphic.
(This also has no close-tag)
There is also the block quote tag, which some might need for quoting things, or as a way to set off a letter or document being read by the characters in a story.
[Text goes here]
This is a block quote. It does not render the same way in all LJ styles, so check preview to see what it looks like in your layout before hitting post. Also keep in mind, other people may be looking at your page in their own style, which may take your blockquoted text and do unspeakable things to it. Use sparingly.
And as a bonus, how to do a spoiler bar:
(You might want to copy and paste this code rather than trying to remember it.)
This is a spoiler, highlight to read.
This is a spoiler, highlight to read.
This is very handy if you have things in a story that people might be upset by and that you want to warn for, but are also major plot points that would spoil the story. By spoiler-barring them, those who need to can check the warnings, and those that don’t need to won’t be spoiled. You can use the names of other basic colours instead (red, blue, green, white, yellow), or a colour hex code if you want a specific colour (there is an online hex code generator
here, just copy the code including the # sign and use it in place of the colour names in the code above). Keep in mind that to work as a spoiler bar, the colours must match, and the colour must be one that can be read when highlighted using the mouse, so be sure to test that when you preview the post.
Things to watch for when using HTML.:
-Make sure all your quotation marks are straight, not curly. Curly quotes will always mess things up in code. If you do your initial writing in a Word or OpenOffice doc, there is a way to turn off curly or ‘smart’ quotes. Refer to your help function for your program. I don’t know how to turn them off in Google Docs, and I wish I did. Also make sure that your quotation marks are in sets, otherwise, it will continue on until it finds another quotation mark to close the first one off and the post will look very odd indeed.
-Make sure you are pasting your HTML-ized entry into the correct LJ posting tab. The LJ Rich Text Editor is evil, and feeding it HTML makes it eviller. Pretend that "Rich Text" tab doesn’t even exist.
-Word processing programs can add things that you don’t want in an HTML document, even if you tell it to be text-only. (Many word processors have a built in ‘web page’ format now. DON’T USE IT FOR LJ. That way lies pain and misery.) If you aren’t comfortable using a text-editor (Notepad, Simpletext, TextEdit) to write, copy your post from your word processing document and paste it into a text document
-Always preview. It’s really easy to miss a closing tag, and if there is no closing tag, the format you’ve chosen will go on forever, and ever, and ever... It’s also easy to put in too many closing tags, or the wrong closing tag. These will show up in the post, looking all lost and forlorn. Go back in and delete the extra tags, or change them to be the right one if for example you’ve got a /b instead of an /i.
-To test an LJ-cut, post the post to yourself as private, then check your journal to see if the cut is functioning correctly. Preview will not show you if the cut is mangled, and all it takes is one missing quotation mark, or some curly quotes to mess up a cut tag.
I’m sure I’m forgetting many things, and of course there’s tables and lists and whatnot, but these are the basics you’ll need for posting using HTML. The LJ HTML editor takes care of a bunch of things like paragraph and break tags that on a straight HTML-coded web page you’d need tags for, so no need to worry about those.
It seems like a lot of work at first, but it can be done. I’ve been writing things directly into HTML for years, and it’s second nature to me now, to the point I have to remind myself not to put in formatting tags when I’m writing email or non-HTML things.
I’m not an expert in HTML by any stretch of the imagination, and this is only a really basic guide-thingy, but I hope this helps some of you escape the evils of the Rich Text editor!