How To Style Text
You've created a password, and entered the administrative portion of your new website. You're ready to publish away, but all you see is a big blank box staring at you.
Where's the WYSIWYG editor? you ask.
As you can see, you don't need a what-you-see-is-what-you-get editor to create text effects. Vine Type uses a technology called Markdown that uses simple character markers to indicate italic or bold, quote or code.
Italics and Bold
To create italic text, surround the characters with a single asterisk or underscore like this...
It was a *lovely* evening.
I enjoyed it _very much_.
...to create this: It was a lovely evening. I enjoyed it very much.
To create bold text surround the text with double asterisks or double underscores...
It was a **lovely** evening.
I enjoyed it __very much__.
...to create this: It was a lovely evening. I enjoyed it very much.
To create bold and italic, you could use three underscores or three asterisks or mix and match but keep them nested correctly...
It was a ***lovely*** evening.
I enjoyed it __*very much*__.
...It was a lovely evening. I enjoyed it very much.
Note to designers:
While I am portraying this styling as "italic" and "bold" we as designers understand that the underlying XHTML markup is <em> and <strong> not the semantically-challenged <i> and <b>. You may adjust the look and feel of these elements to match they style of the website you designed.
Headings
When writing for the web, a good rule of thumb is to provide section headings. There are two ways to do this. Use octothorpes (didn't know the # key had a name other than 'pound' or 'hash' did you?) or underline the heading with dashes or equal signs.
#First Level Heading
Another First Level Heading
===========================
##Second Level Heading
Another Second Level Heading
----------------------------
###Third
####Fourth
#####Fifth
######Yes, Even Sixth Level Headings
I won't show these here, but will mention that the section headings on this page are second level headings and you can see they appear in a different color than the rest of the page.
Quotes
To indent for a quotation begin the line with a greater-than sign and a space. The remainder of the text will be placed into a <blockquote> tag which usually causes indentation...
> "I never met a man I didn't like."
> -- Will Rogers.
...displays like this:
"I never met a man I didn't like." -- Will Rogers.
Lines and Spaces
Lines and spaces mean something to Markdown. If you place a blank line between text, it means you want to start a new paragraph.
this
is
one paragraph
this is another
produces this:
this is one paragraph
this is another
If you want to force a break to a new line, place two spaces at the end of that line and Vine Type will put a break where you want it. You won't be able to see it in the example, but I'm putting two spaces after the word blue
roses are red
violets are blue
to force a new line add spaces two.
produces this:
roses are red violets are blue to force a new line add spaces two.
There's More!
What I've shown you is probably all you'll need to style text on your Vine Type website. If you are interested in learning about even more options, the full syntax is available at the site that created Markdown, Daring Fireball