This post is an update and reorganization of an earlier post giving tips for posting and commenting on OS. This is my take on the basics: how to put links to other Web pages in your posts and comments, how to add video and audio to posts, and so forth. Many other OSers know as much about OS as I do, and their posts are worth tracking down. To do that, type OS user manual or OS tips into the Search box at the top of any OS page.

Preliminaries. (If you already know what HTML is, you can skip to the next section.) I started writing this post by typing into the text edit box you see above. I put the word "Preliminaries" in boldface by selecting it and then clicking on the B icon, added a line above it, and then decided to upload an image, a screen shot, in between. Straightforward, right?

Sort of. As you might expect, something tricky is happening behind the scenes. When I type in text, the OS software is recording what I type. When I click on one of those icons, though, the software inserts little invisible codes, or tags, to tell the Web browser how what I've written should be displayed. For example, one way to say that some text should be italicized is to wrap the appropriate tag around it, so: <i>some text</i>. The result, when displayed in a Web browser, looks like this: some text. These tags are part of a language, called HTML (HyperText Markup Language), that can be used to describe how content (text, pictures, and so forth) is displayed on the Web.

Why should you care about this? In an ideal world, you wouldn't have to. But computer environments are never ideal worlds. Knowing what's going on behind the scenes can help you learn how to do new things and understand how to fix broken things. For example, sometimes when you save a post and look at its preview, you'll see HTML tags sprinkled here and there. Don't panic--you just have to edit the post and save it again; everything should be taken care of.

Ready? Let's go.

About blog posts

How do I include a link to another Web page in a post? Suppose you've copied a link to another Web page, and when you paste it into the post you're composing, it comes out looking like this: http://open.salon.com/. Hmm. You'd really like it to look like this: The OS cover page. Here's what you do: Instead of including just the bare Web address, you make it part of an "anchor" tag that's wrapped around some ordinary text, like this: <a href="http://open.salon.com/">The OS cover page</a>.

How do I put a picture in a post? The simplest way to do this is to upload an image file to the OS servers. (You can do something called hotlinking instead [thanks to Tinkerertink69 for the suggestion], but we'll stick to the basics.) So you use the little tree icon (which you can see in the screen shot above; in fact, to include that screen shot I did just what I'm describing now). If you'd like to know more, for example about resizing your picture once you've uploaded it, check out this post.

Can I make my text cool colors instead of basic black? Indeed you can. This post by lalucas shows how.

What about fancier formatting? If you're not intimidated by TLAs (three letter acronyms), Kent Pitman's gentle CSS tutorial will show you the ropes.

How can I add a video to a post? OS handles videos differently from images, in that you need to have the video "hosted" elsewhere (i.e., stored and accessible on some other site). The easiest way to show a video in an OS post is to use youtube. Here's how: Go to the youtube Web page for a specific video you'd like to show in your OS blog post. On that youtube page you'll see a text box on the side, labeled "Embed", something like this:

Select and copy the contents of the box, the HTML beginning with <object... When you return to the OS post you're composing, just paste all that HTML where you'd like the video to appear. You'll have to save your post, edit it again, and save it again for the video to appear. (And when you're editing the post, you may see nothing more than a blank box where the video should be, but don't worry--it'll resolve itself when you save the post the second time.) Here's what you should see when you're done.

How can I add audio, such as music, to a post? One way is to find a youtube video with the music track you'd like to post, and use that. But you can include audio alone. It's a bit more complicated than adding video, and it hasn't always worked for me with all music files, but we'll give it a shot, using the approach artsfish describes. You'll need to have your music, in the form of an mp3 file, stored somewhere accessible; as with videos, OS doesn't host audio files. For illustration, I'll be using a music file containing a cover of "I Am Ready" by our own Stacey Youdin. Here's the Web address for the file: http://pages.google.com/edit/msyoudin/1_i_am_ready.mp3. Go to this Google blog page and follow the instructions there. You'll end up copying some HTML (though with your own music file where Stacey's file is),

which you should paste into the post you're composing. After you run through the save/re-edit/re-save business, you should see this:

You're ready to rock.

About comments

Writing comments is a lot like writing posts, except that you can't do much more than create text with links and a few font changes, and you don't have a preview or edit facility. You might think, "Why bother?" but a lot of OSers follow a convention of putting quoted material in italics in their comments, so that it's clear who wrote what.

How do I include a link to another Web page in a comment? The only way to do this is by typing out the HTML: <a href="http://open.salon.com/">The OS cover page</a>.

Can I do italics and boldface and so forth? Yes, also using HTML. If you want something to appear italicized, type <i>italicized</i>. For bold text, type <b>bold</b>. You can even combine bold and italicized text.

Now, if you write a long, complex comment that contains lots of HTML and want to make sure that you haven't mistyped anything critical, one workaround for the lack of a preview facility is to create a new post, type or paste in your comment, and see how it looks in draft form, following the advice above. If it looks good, use what you've typed for your comment. Not everything will transfer from post to comment, but at least you'll have made sure your HTML isn't broken.

That's it! At least, that's all I can think of. Questions, comments, and corrections are welcome.