Headlines, Paragraphs, and Basic Formatting with Markdown10:27 with Wade Christensen
Learn how to format all the basic parts of a document, including headlines, paragraphs, bolding, italics, block quotes, and horizontal rules. We'll be practicing all of these concepts by building a cheat sheet document that you can use as a reference later. We'll continue building upon this document as we go.
Remember, you can get copies of the cheat sheet in its current state as well as a complete version from the downloads tab associated with this video. Everything comes together in a single .zip file.
I learned markdown from a cheat sheet. 0:00 And I still reference cheat sheets when I can't remember how to format something. 0:02 But cheat sheet is just a document with notes that you can reference when needed. 0:06 It's impossible to remember everything about any coding language. 0:10 So this type of reference document, or cheat sheet, is helpful. 0:14 I thought it might be nice to create a cheat sheet together. 0:18 If you follow along with these videos, you will by the end of the course, 0:20 have a mark down cheat sheet for your own reference. 0:24 That's right, we're going to use markdown to make a markdown reference. 0:26 Enough of my mug, let's see my screen and go from there. 0:31 In this video, I'll cover creating headlines, paragraphs, 0:34 quotes, bolding and italicizing text, and creating horizontal rules. 0:38 In the previous video, I created the headline. 0:44 To format a headline, or heading, in markdown, you use a pound symbol or 0:46 #, and then the text that you wanna use for your heading. 0:52 That's why markdown basics is large and bold over here in our preview. 0:56 It's formatted as a first level heading. 1:00 The most common way to render markdown is with HTML. 1:03 Basically our final document will be translated into HTML for use on the web. 1:07 HTML provides six levels of headings. 1:12 For this reason, we have six levels of headings in markdown too. 1:15 Again, you don't need to know any HTML. 1:19 I bring it up here only to provide some background. 1:21 You type that single hash to create the largest, or first level, heading. 1:24 A second level heading uses two hashes next to each other followed by 1:29 a space in your text. 1:32 The rest of the headlines just use another hash. 1:34 The first section of our cheat sheet will be about headlines, 1:37 paragraphs and basic formatting, so let's add that as a second level heading. 1:40 So type one, two hashes, space and 1:45 then our text which is Headlines, 1:50 Paragraphs, and Basic Formatting. 1:55 Now beneath this larger topic, we've been talking about headlines and 2:00 since we're creating a cheat sheet together, let's create that as a third 2:05 level heading, so one, two, three, and we'll call this headlines. 2:09 Now, to save us a little bit of time, 2:15 I'm going to just copy some headlines that I already have and paste them in here. 2:18 And you can see our fourth, fifth and sixth level headings, here in our preview. 2:26 We'll create some more heading as we go. 2:34 But I think this is enough demonstration for now. 2:35 Let's delete this starter text and write our paragraphs and line break section. 2:38 So I'll add that as another third level heading. 2:44 We'll call this Paragraphs and Line Breaks. 2:49 We create paragraphs by typing the way we would in any other program. 2:57 Just hit Return twice to start another paragraph. 3:01 There is really nothing special about the paragraph. 3:03 Where you see empty space between blocks of text and 3:07 your mark down document you will see empty space separating those 3:10 blocks of text in your formatted HTML document. 3:13 I'm going to save us a little time again and just paste in two paragraphs here. 3:16 As you can see we have space here which corresponds to our space over here. 3:23 Now to make this a little easier to see I'm just gonna add a bunch of returns 3:28 in here that's not important for 3:32 the document but it just makes it a little easier to see in the video. 3:35 Now you don't always want that space that appears between one line of text and 3:39 another when you're creating line breaks. 3:44 For example, lines of poetry or 3:46 song lyrics don't typically have spaces between them the way paragraphs do. 3:48 To add just a Line Break without a space type two spaces at the end of the line and 3:53 then press Return once. 3:58 Let's practice this by adding a stanza from Pablo Neruda's Sonnet number 17. 4:00 So I'll just type the first line here. 4:05 And then this is the end of our first line so I'll type one, two spaces. 4:14 Return and my second line. 4:20 And this is the end of my second line, so one, two, return. 4:24 And our third line, 4:29 And again, one, two. 4:41 And now to save us a little bit of time I'm just going to copy the last 4:43 two lines of the stanza as well as our attribution and paste them into our doc. 4:46 Okay, and if we scroll down in our preview, 4:53 we can see that this is working mostly the way we expect. 4:55 However, here between, any and other, we should have a line break. 4:59 So, we can just come up and fix that one two. 5:06 And you can see it fixed here in the preview. 5:10 And then don't worry about this too much, this is just the attribution for 5:13 the book that I pulled this stanza out of. 5:17 You can definitely check it out if you want, Pablo Neruda stuff is great. 5:20 So let me come over here and we will add another heading for our next section, 5:24 which is Emphasis and Bolding. 5:28 The ability to italicize and bold text is a must for any formatting tool. 5:36 Markdown makes it easy. 5:40 Let's start with emphasis which will show up as italicized text. 5:41 Now, I'm gonna throw in a fourth level heading here for italics, 5:46 it might seem like overkill but I like to keep things as organized as possible. 5:50 So one two three four italics, and 5:53 then I'll throw in again just a bunch more returns, and that's just to make it. 5:58 Easy for us to see. 6:03 Now, emphasis can be added by placing either the asterisk or 6:05 the underscore characters on both sides of the text that you wanna format. 6:09 So, this works and 6:13 this Works too. 6:18 If we scroll down in our preview you can see works as italicized in both places. 6:25 I recommend using the * like this because it's preferred by the type of mark down 6:31 used on GitHub which is a popular service used by programmers, 6:36 we mentioned it earlier. 6:39 Also, in coding languages such as Python, the underscore character is used often, 6:41 so it's nice to have the underscore stand out as part of your text 6:45 rather than allowing it to be mistaken for Markdown syntax. 6:48 Bolding is just like italicizing text but you add another asterisk or 6:54 underscore on both sides of the text. 6:58 So, this works and 7:01 this Works too. 7:06 And again you can see down in the preview our text is bold in both places. 7:12 Again, I prefer the asterisk to the underscore. 7:19 The important thing is to be consistent pick one of the options and 7:22 stick to it throughout the markdown file. 7:26 You can even bold and italicize text at the same time, like this. 7:28 So we have two for the bolding, one for the italics, and 7:36 again both sides of the text. 7:41 And this would work too, again one for 7:44 italics, two for bolding, and 7:50 you can see here on our preview works is italicized abled in both places. 7:55 All right, we've covered some core topics but 8:01 there are two more things to see in this video. 8:03 The Blockquote and the Horizontal Rule. 8:05 A blockquote sets text apart from the rest of the document. 8:08 As the name implies, it's often use for quotes, 8:11 more specifically it indicates that the text is quoted from another source. 8:14 So let's thrown in a third level heading for Blockquotes. 8:18 And then to save us a little time, I have a quote all ready to paste in here, 8:25 from the creator of Markdown, John Gruber, paste that there. 8:31 Now you might've noticed something. 8:38 The Blockquote is formatted using the greater than symbol. 8:40 If you want the blockquote to span multiple paragraphs 8:44 the greater than symbol needs to appear on the empty space between paragraph as well. 8:48 Now let's scroll down in our preview. 8:53 And you can see the way Adam is displaying this we have this bar, 8:55 beside the Blockquote, the background is a slightly different color. 8:59 And we have our text all indented and separated out from the rest of the text. 9:03 So you can see there's just a little bit formatting for 9:09 a Blockquote to separate it out. 9:12 Okay, that's a good start. 9:15 Let's separate this from our next section with our horizontal rule. 9:17 Which is just a line used to separate sections of a document. 9:21 First I will create a few returns in here so we can see what we're doing, 9:25 and one, two, three, Horizontal Rule. 9:31 Now you create the Horizontal Rule with either underscores, hyphens, 9:39 or the asterisk. 9:43 I prefer hyphens because that leaves the asterisk for 9:45 bolding, italicizing, and making lists, which we'll see in the next video. 9:48 Also hyphens look like lines, 9:53 so they're easy to remember when making a Horizontal Rule. 9:55 I'll type all three examples here just so that you can see them in action. 9:58 So we've got the ___, the ---, 10:03 and the ***, 10:07 and you can see it's just three of those in all three cases. 10:10 If we scroll down you can see three Horizontal Rules. 10:16 All right, that's a wrap on this section. 10:21 Save this, and I will see you in the next video. 10:24
You need to sign up for Treehouse in order to download course files.Sign up