1 00:00:00,330 --> 00:00:01,748 Hi, welcome back. 2 00:00:01,749 --> 00:00:04,035 Previously, we built the homepage of our 3 00:00:04,036 --> 00:00:06,830 app showing a list of Blog Posts. 4 00:00:07,490 --> 00:00:10,772 Now we want to add a link, that will 5 00:00:10,773 --> 00:00:13,810 take the user to each of the Blog Post. 6 00:00:13,811 --> 00:00:15,060 So let's do that. 7 00:00:15,061 --> 00:00:20,276 We have an h1 tag, HTML tag and a p 8 00:00:20,277 --> 00:00:26,002 tag, so paragraph tag, which are in index.html. 9 00:00:26,003 --> 00:00:33,196 So, what we could do is that, instead of 10 00:00:33,197 --> 00:00:36,588 having this as simple text, we can turn it 11 00:00:36,589 --> 00:00:40,118 into a link, so the titles could become links. 12 00:00:40,119 --> 00:00:44,352 To do that, instead of using h2 tags, we 13 00:00:44,353 --> 00:00:52,780 could use a tags, and put the title in between. 14 00:00:53,870 --> 00:00:58,868 Now, a tags in HTML are used for links and 15 00:00:58,869 --> 00:01:06,152 buttons, so clickable elements, HTML elements, and therefore these 16 00:01:06,153 --> 00:01:10,900 tags, expect to have a link which should come 17 00:01:11,830 --> 00:01:15,140 as a value of the href property. 18 00:01:16,310 --> 00:01:20,878 So this as you see, goes inside these brackets. 19 00:01:20,879 --> 00:01:24,972 So a, the first a is this one in here, then 20 00:01:24,973 --> 00:01:30,710 comes the title, then comes the second a, with this slash. 21 00:01:30,711 --> 00:01:33,312 So href is equal to 22 00:01:33,313 --> 00:01:35,702 parentheses, and inside the parentheses 23 00:01:35,703 --> 00:01:39,740 now, we want to insert the link to the Blog Post. 24 00:01:41,170 --> 00:01:43,556 So we want to make this dynamic right. 25 00:01:43,557 --> 00:01:46,452 We are here inside a for loop, that is 26 00:01:46,453 --> 00:01:51,650 looping through every post, in our post_list. 27 00:01:51,651 --> 00:01:54,840 And so we have access to each 28 00:01:54,841 --> 00:01:57,166 of the posts, through this variable. 29 00:01:57,167 --> 00:01:59,678 post is an instance. 30 00:01:59,679 --> 00:02:04,180 So in the first iteration this will be the Cat post. 31 00:02:05,290 --> 00:02:08,705 Therefore, so here we get the title of Cats, 32 00:02:08,706 --> 00:02:11,554 but then we can get the slug of cats. 33 00:02:11,555 --> 00:02:20,040 So which could be something, like localhost:8000 34 00:02:20,570 --> 00:02:24,994 and then we could say post.slug. 35 00:02:24,995 --> 00:02:27,580 So this would be one way to do it. 36 00:02:27,581 --> 00:02:31,828 So post.slug would be variable, this would be 37 00:02:31,829 --> 00:02:33,508 one way to do it, but it's not the 38 00:02:33,509 --> 00:02:37,300 best way because, localhost will be changed to something 39 00:02:37,301 --> 00:02:41,524 else, probably later on, when you deploy your app. 40 00:02:41,525 --> 00:02:45,060 And the best way to do it is, to delete this. 41 00:02:45,910 --> 00:02:49,912 And inside this parenthesis, you use a 42 00:02:49,913 --> 00:02:56,382 URL tag, which comes with this symbol. 43 00:02:56,383 --> 00:03:01,836 So curly bracket, percentage, percentage, curly bracket and inside 44 00:03:01,837 --> 00:03:06,250 here you say url, so it's a keyword. 45 00:03:06,251 --> 00:03:10,032 And inside single quotes this time, 46 00:03:10,033 --> 00:03:12,080 or you can also use double quotes, but 47 00:03:12,081 --> 00:03:15,312 since we used double quotes here, it makes 48 00:03:15,313 --> 00:03:17,100 sense to use single quotes here. 49 00:03:17,550 --> 00:03:21,828 Inside here, goes the url of that current 50 00:03:21,829 --> 00:03:25,150 post, that is being iterated in the loop. 51 00:03:26,210 --> 00:03:29,920 So we need the URL of the post, 52 00:03:30,690 --> 00:03:34,550 which we can get from urls.py. 53 00:03:34,551 --> 00:03:39,380 So we're talking about this url, right? 54 00:03:39,910 --> 00:03:41,540 So blog_view. 55 00:03:42,710 --> 00:03:45,032 So this name that we gave to this 56 00:03:45,033 --> 00:03:51,400 urlpattern, is now being used, in here, 57 00:03:52,010 --> 00:03:56,050 to extract that particular URL pattern. 58 00:03:56,051 --> 00:04:02,700 So, that was again blog_view, blog_view. 59 00:04:03,390 --> 00:04:07,390 Let's save this and see what's going to happen. 60 00:04:07,391 --> 00:04:11,983 Save, make sure the server is running 61 00:04:11,984 --> 00:04:17,738 go here, reload, and we get this error, Reverse 62 00:04:17,739 --> 00:04:20,190 for blog_view, with no arguments. 63 00:04:20,733 --> 00:04:24,366 So this expects a slug argument, 64 00:04:24,367 --> 00:04:26,800 [No Audio] 65 00:04:26,801 --> 00:04:29,032 this url tag here. 66 00:04:29,033 --> 00:04:32,600 So this blog_view also needs to get 67 00:04:32,601 --> 00:04:35,633 [No Audio] 68 00:04:35,634 --> 00:04:39,450 post without quotes .slug. 69 00:04:39,451 --> 00:04:42,348 So the slug of the post, of that 70 00:04:42,349 --> 00:04:50,336 current post, save, reload, and this time we 71 00:04:50,337 --> 00:04:52,950 see these are being rendered as links. 72 00:04:52,951 --> 00:04:55,568 So let's click one of them Cats, and 73 00:04:55,569 --> 00:04:57,820 it takes us to the cats web page. 74 00:04:59,070 --> 00:05:02,100 Dogs and it takes us to the dogs web page. 75 00:05:02,101 --> 00:05:06,640 Now we can improve the looking of this by 76 00:05:07,410 --> 00:05:14,190 putting this thing inside, some h2 tags. 77 00:05:14,770 --> 00:05:20,666 So that entire variable including the curly brackets 78 00:05:20,667 --> 00:05:25,070 goes inside h2 tags, and reload. 79 00:05:26,090 --> 00:05:28,188 Yeah, it looks better now. 80 00:05:28,189 --> 00:05:32,630 And that is how, you use URL tags in Django. 81 00:05:33,450 --> 00:05:35,314 That is the format. 82 00:05:35,315 --> 00:05:37,228 Thanks for following this video. 83 00:05:37,229 --> 00:05:39,452 In the next video, we are going to 84 00:05:39,453 --> 00:05:43,378 use some styling using the Bootstrap CSS library. 85 00:05:43,379 --> 00:05:44,400 Talk to you later.