LJ HTML guide for newbies!
I am by no means an expert coder, but I've picked up quite a bit in the past few years -- enough that I feel comfortable compiling this guide to the most basic of coding for LiveJournal posts.
Codelicous!
A somewhat detailed guide to posting on LiveJournal for newbies or people who are just now letting go of RichText, by sparklpocalypse.
Basic Formatting: boldify · italicize · underline · strikethrough
Slightly Less Basic: embedding images · creating links · linebreaks on LJ
Little More Formatting: centering content · creating dividers
LJ-Specific Coding: linking to users/communities · cut tags
So you want to format a LiveJournal post without using the dreaded RichText editor? Here's some basic tags you should know:
· · ·
Basic formatting: bold, italics, underline, strikethrough.
To boldify text, use . For example:
I like narwhals and butterflies!
... is coded: I like narwhals and butterflies!
On Tumblr, this tag is replaced with .
To italicize text, use . For example:
Help! I've lost a piece of cheese in my ear!
... is coded: Help! I've lost a piece of cheese in my ear!
On Tumblr, this tag is replaced with .
To underline text, use . For example:
I don't know what you're talking about, Mr. Jones. I assure you, I've always had purple hair.
... is coded: I don't know what you're talking about, Mr. Jones. I assure you, I've always had purple hair.
To strike through text, use . For example:
I hate love your new shirt! It's so awful cute! Where'd you get it?
... is coded: I hate love your new shirt! It's so awful cute! Where'd you get it?
On Tumblr, this tag is replaced with .
![]()
· ·
·
A little more advanced: links, images, and linebreaks.
![]()
For artists, your PNG, JPG, or GIF images will be the most important part of your post. But how to include them? Simple: Use the![]()
tag. For example:
... is coded:
The bit between the quotes that follows src= in the![]()
tag must be the direct link to wherever your image is hosted online. If it's a path to a webpage, such as the deviantART feedback page for that image, this tag will not work.
You have to use a new![]()
tag for each image you want to include in your post.
You might also want to include links to things in your post. For this, you use the tag. For example:
Hey, check out this super cool site!
... is coded: Hey, check out this super cool site!
The bit between the quotes that follows href= in the tag is the URL you're linking to. You can link to images, websites, etc.
You can also turn an image into a thumbnail link, as in the following example (click the thumbnail to view larger):
... is coded:
By placing the image tag inside the link tag, the image becomes the bit of your post that is a link.
·
What about linebreaks on LiveJournal? Well -- on a lot of sites, HTML editors require that you include
(paragraph) and
(linebreak) tags. LiveJournal does not. Including these tags when you use the HTML editor just means that you'll have obnoxiously large breaks between paragraphs in your post -- upwards of one inch, in some cases. To add a linebreak in a LiveJournal post, you just need to hit the enter key. To double-space, hit the enter key twice. So strip those
and
tags from your posts when you copy from Tumblr, and double space with the enter key instead. Or triple space, if you prefer.
·
Just a tad more formatting.
As you might have guessed, is used to center things on the line. It's one of the tags you can't use on Tumblr, so it might be new to a few of you.
Rollercoasters are awesome!... is coded: Rollercoasters are awesome!
The tag can also be used to center images.
... is coded:
The tag automatically adds an extra linebreak after it, so if you're a stickler for perfect formatting, hit the enter key one less time than you normally would at the end of the line, after your centered content. Without the aid of more advanced HTML than we're going to go into in this guide, you can't have both centered and regular text on the same line.
On the off-chance that you want to add horizontal dividers in the body of your post, but don't want to use custom text/image dividers and the tag to do it, is for you. Just slap a into your post where you'd like the divider to be, and you're good! This is one of the few basic HTML tags that you don't have to close.
user ·
LiveJournal-specific coding.
user
Want to link to someone's LiveJournal or a LiveJournal community in your post, including the userhead link to their profile? It's as simple as using the user tag.
LIVEJOURNAL: genghischan is coded genghischan
COMMUNITY: kurtofskyrebang is coded kurtofskyrebang
Just use the username/community name in place of the ones provided above and you're set.
If you're new to LiveJournal, chances are you'll post something to a community without a cut tag, and about fifteen different people will comment that your post needs a cut. Here's how to do one: you use .
You simply place the content you want to hide behind the cut in between and and it'll be hidden from the community/your friends list until people click on the link. It's generally an unspoken LiveJournal rule that any text more than a paragraph long, any images more than 350px wide by 400px tall, and any content that isn't worksafe or contains spoilers/triggering material/controversial material should be placed behind a cut.
The "fake cut" is a link that's been formatted to look like a cut tag. People sometimes use these if they post things on their journals, and then crosspost the links to communities. However, a simple link is totally sufficient in these cases, unless you feel up to coding the rest of the "fake cut."
Was this at all helpful?
Codelicous!
A somewhat detailed guide to posting on LiveJournal for newbies or people who are just now letting go of RichText, by sparklpocalypse.
Basic Formatting: boldify · italicize · underline · strikethrough
Slightly Less Basic: embedding images · creating links · linebreaks on LJ
Little More Formatting: centering content · creating dividers
LJ-Specific Coding: linking to users/communities · cut tags
So you want to format a LiveJournal post without using the dreaded RichText editor? Here's some basic tags you should know:
· · ·
Basic formatting: bold, italics, underline, strikethrough.
To boldify text, use . For example:
I like narwhals and butterflies!
... is coded: I like narwhals and butterflies!
On Tumblr, this tag is replaced with .
To italicize text, use . For example:
Help! I've lost a piece of cheese in my ear!
... is coded: Help! I've lost a piece of cheese in my ear!
On Tumblr, this tag is replaced with .
To underline text, use . For example:
I don't know what you're talking about, Mr. Jones. I assure you, I've always had purple hair.
... is coded: I don't know what you're talking about, Mr. Jones. I assure you, I've always had purple hair.
To strike through text, use . For example:
I hate love your new shirt! It's so awful cute! Where'd you get it?
... is coded: I hate love your new shirt! It's so awful cute! Where'd you get it?
On Tumblr, this tag is replaced with .
· ·
·
A little more advanced: links, images, and linebreaks.
For artists, your PNG, JPG, or GIF images will be the most important part of your post. But how to include them? Simple: Use the
tag. For example:
... is coded:
The bit between the quotes that follows src= in the
tag must be the direct link to wherever your image is hosted online. If it's a path to a webpage, such as the deviantART feedback page for that image, this tag will not work.
You have to use a new
tag for each image you want to include in your post.
You might also want to include links to things in your post. For this, you use the tag. For example:
Hey, check out this super cool site!
... is coded: Hey, check out this super cool site!
The bit between the quotes that follows href= in the tag is the URL you're linking to. You can link to images, websites, etc.
You can also turn an image into a thumbnail link, as in the following example (click the thumbnail to view larger):
... is coded:
By placing the image tag inside the link tag, the image becomes the bit of your post that is a link.
·
What about linebreaks on LiveJournal? Well -- on a lot of sites, HTML editors require that you include
(paragraph) and
(linebreak) tags. LiveJournal does not. Including these tags when you use the HTML editor just means that you'll have obnoxiously large breaks between paragraphs in your post -- upwards of one inch, in some cases. To add a linebreak in a LiveJournal post, you just need to hit the enter key. To double-space, hit the enter key twice. So strip those
and
tags from your posts when you copy from Tumblr, and double space with the enter key instead. Or triple space, if you prefer.
·
Just a tad more formatting.
As you might have guessed, is used to center things on the line. It's one of the tags you can't use on Tumblr, so it might be new to a few of you.
Rollercoasters are awesome!... is coded: Rollercoasters are awesome!
The tag can also be used to center images.
... is coded:
The tag automatically adds an extra linebreak after it, so if you're a stickler for perfect formatting, hit the enter key one less time than you normally would at the end of the line, after your centered content. Without the aid of more advanced HTML than we're going to go into in this guide, you can't have both centered and regular text on the same line.
On the off-chance that you want to add horizontal dividers in the body of your post, but don't want to use custom text/image dividers and the tag to do it, is for you. Just slap a into your post where you'd like the divider to be, and you're good! This is one of the few basic HTML tags that you don't have to close.
user ·
LiveJournal-specific coding.
user
Want to link to someone's LiveJournal or a LiveJournal community in your post, including the userhead link to their profile? It's as simple as using the user tag.
LIVEJOURNAL: genghischan is coded genghischan
COMMUNITY: kurtofskyrebang is coded kurtofskyrebang
Just use the username/community name in place of the ones provided above and you're set.
If you're new to LiveJournal, chances are you'll post something to a community without a cut tag, and about fifteen different people will comment that your post needs a cut. Here's how to do one: you use .
You simply place the content you want to hide behind the cut in between and and it'll be hidden from the community/your friends list until people click on the link. It's generally an unspoken LiveJournal rule that any text more than a paragraph long, any images more than 350px wide by 400px tall, and any content that isn't worksafe or contains spoilers/triggering material/controversial material should be placed behind a cut.
The "fake cut" is a link that's been formatted to look like a cut tag. People sometimes use these if they post things on their journals, and then crosspost the links to communities. However, a simple link is totally sufficient in these cases, unless you feel up to coding the rest of the "fake cut."
Was this at all helpful?