0
1
00:00:00,250 --> 00:00:00,600
All right.
1

2
00:00:00,720 --> 00:00:04,070
Spoiler warning. I'm going to reveal the answer.
2

3
00:00:04,470 --> 00:00:12,360
Inside the EJS documentation you might remember that I pointed you to the part that says layouts. And this
3

4
00:00:12,450 --> 00:00:19,800
allows you to include headers and footers by using this syntax and the key word include. So we can use
4

5
00:00:19,800 --> 00:00:23,810
this syntax to include our header and footer.
5

6
00:00:24,210 --> 00:00:27,570
So let's go ahead and implement it in our file as well.
6

7
00:00:27,840 --> 00:00:29,320
Inside our home.
7

8
00:00:29,580 --> 00:00:36,570
ejs we're going to delete everything other than our h1 and our paragraph tag because we've got everything
8

9
00:00:36,840 --> 00:00:39,070
inside our header and footer.
9

10
00:00:39,390 --> 00:00:47,100
Now instead of those bits of HTML code we're going to use our EJS  layout syntax which is angle bracket,
10

11
00:00:47,400 --> 00:00:55,720
percentage sign, minus sign or dash and then we use the keyword include and we open up a set of parentheses.
11

12
00:00:56,040 --> 00:01:02,040
And then inside the parentheses we specify the name of the file that we want to include which in this
12

13
00:01:02,040 --> 00:01:05,110
case will be header because we have a file called header.
13

14
00:01:05,120 --> 00:01:15,120
ejs inside our views directory. And then we close off our EJS tag with again a minus sign, percentage
14

15
00:01:15,300 --> 00:01:16,570
and angle bracket.
15

16
00:01:16,960 --> 00:01:24,110
And let's go ahead and copy that down here so that we can do the same for our footer.
16

17
00:01:24,350 --> 00:01:30,740
Now this word has to match the EJS file that you've got inside your views folder
17

18
00:01:30,890 --> 00:01:32,200
in order for it to work.
18

19
00:01:32,360 --> 00:01:36,550
So now that we've got that code in there let's go ahead and hit save.
19

20
00:01:36,830 --> 00:01:40,840
And once you refresh your page this is what you should see.
20

21
00:01:40,970 --> 00:01:47,240
Now if you had a search for how to do this and you come across some answers you might realize that there's
21

22
00:01:47,240 --> 00:01:51,420
quite a few ways of creating that syntax.
22

23
00:01:51,650 --> 00:01:59,330
For example in this case, they've simply just said angle percentage include and then the path of the
23

24
00:01:59,330 --> 00:02:01,320
file from the views folder.
24

25
00:02:01,630 --> 00:02:09,400
Or in this case over here you've got a dash in the front and no dash at the back and there's no parentheses.
25

26
00:02:09,410 --> 00:02:15,290
So all of these different methods work and the method that we should try and follow is the one that's
26

27
00:02:15,290 --> 00:02:17,530
used inside the documentation.
27

28
00:02:17,810 --> 00:02:23,510
But for our challenges sake it doesn't matter which method you chose to use as long as you get the end
28

29
00:02:23,510 --> 00:02:28,330
result and you've achieved the goal then you've successfully completed the challenge.
29

30
00:02:28,340 --> 00:02:30,770
All right so here's onwards to challenge 4.