1
00:00:00,550 --> 00:00:03,790
The next page will modify is the about page.

2
00:00:03,970 --> 00:00:07,690
Go ahead and open the about Dot p p page in a text editor

3
00:00:19,610 --> 00:00:22,300
will need to do a few things on this page.

4
00:00:22,340 --> 00:00:25,430
First we need to change the page titles and headers.

5
00:00:25,430 --> 00:00:34,560
This image over here will also be replaced with a YouTube video.

6
00:00:34,690 --> 00:00:39,490
We'll go ahead and change the sample text over here to a relevant text.

7
00:00:39,490 --> 00:00:45,040
We'll also update the image place holders and the names below.

8
00:00:45,040 --> 00:00:50,800
And just like we did for the home page we'll delete the navigation menu code block and replace it with

9
00:00:50,800 --> 00:00:52,440
our include statement.

10
00:00:52,600 --> 00:00:56,260
So the navigation menu will be included from the external file.

11
00:00:56,590 --> 00:00:58,220
So let's go ahead and get started.

12
00:00:58,300 --> 00:00:59,880
Scroll down to line 12.

13
00:01:01,800 --> 00:01:03,360
And change the page title

14
00:01:13,500 --> 00:01:20,260
scroll down to line 35 and change this text here.

15
00:01:20,290 --> 00:01:22,150
This represents is heading

16
00:01:35,210 --> 00:01:38,260
do the same on line 81 and 135.

17
00:01:47,640 --> 00:01:49,520
Now this is for this heading here

18
00:01:55,710 --> 00:02:06,930
in line 135 is our copy rate.

19
00:02:07,280 --> 00:02:13,610
So next we'll delete our navigation code block and replace it with our include statement so I'll just

20
00:02:13,610 --> 00:02:20,210
scroll up to bind thirty nine and delete that entire block.

21
00:02:24,240 --> 00:02:32,490
And then paste in the include statement.

22
00:02:32,620 --> 00:02:38,590
Let's go ahead and replace this text with the relevant text.

23
00:02:46,580 --> 00:02:55,340
And so on line 56 I'm just going to delete the text inside the paragraph tags and paste in the new text.

24
00:02:55,470 --> 00:02:56,180
And there you go.

25
00:02:57,420 --> 00:03:05,180
So the next thing we want to do here is is replace the image with an embedded YouTube video.

26
00:03:05,190 --> 00:03:09,630
First we need to locate the code block which pertains to this image.

27
00:03:09,630 --> 00:03:14,840
One way of doing that is he is using the development tools in your web browser.

28
00:03:14,970 --> 00:03:21,850
So if you right click on this image I'm using google chrome and just click inspect you'll notice it

29
00:03:21,850 --> 00:03:22,840
takes us.

30
00:03:22,840 --> 00:03:31,660
It highlights the code block pertaining to that image and we can see that the source is slide to dodge

31
00:03:31,670 --> 00:03:35,480
RPG so I can just look for that.

32
00:03:37,000 --> 00:03:43,660
Code in our file and I found it here online fifty three.

33
00:03:43,720 --> 00:03:51,750
If you're dealing with a page that has a lot more code you can always just press control F to find a

34
00:03:51,750 --> 00:03:52,530
specific

35
00:03:55,330 --> 00:03:56,080
line of code

36
00:04:01,720 --> 00:04:03,580
to embed a YouTube video.

37
00:04:03,610 --> 00:04:05,080
Go to youtube dot com

38
00:04:13,330 --> 00:04:15,770
and you can pick any video you like.

39
00:04:15,790 --> 00:04:18,560
Again this is just for sample purposes.

40
00:04:18,640 --> 00:04:22,210
Go ahead and choose this one just click on it.

41
00:04:25,750 --> 00:04:28,480
And copy the U or L for the video.

42
00:04:28,580 --> 00:04:31,940
So right click and hit copy.

43
00:04:32,020 --> 00:04:37,200
Now go to this web page.

44
00:04:37,250 --> 00:04:46,030
It's called embed responsively dot com this web page will automatically generate this SS to embed your

45
00:04:46,030 --> 00:04:48,760
desired YouTube video responsibly.

46
00:04:48,760 --> 00:04:58,240
So all we need to do is paste the YouTube page you URL and hit embed so you can see a preview and just

47
00:04:58,240 --> 00:04:59,980
copy the code here.

48
00:04:59,980 --> 00:05:04,970
The embed code in pasted in place of our image

49
00:05:10,980 --> 00:05:16,870
I'll just close this you know press I've saved the file and I'll press refresh and you can see that

50
00:05:16,870 --> 00:05:21,960
it's embedded the video and it is responsive as well

51
00:05:26,430 --> 00:05:33,430
so it's a much easier read than having to type out this entire style sheet and remember if you'd like

52
00:05:33,440 --> 00:05:37,100
you can also put this style sheet in your head tag.

53
00:05:37,180 --> 00:05:40,390
But for now we'll just leave it as an in line style tag.

54
00:05:40,810 --> 00:05:47,820
Lastly we need to change the images over here under the heading Our team so we'll scroll down

55
00:05:50,920 --> 00:06:00,330
and for me that's going to be online the first image is going to be online 74 so I just need to change

56
00:06:00,330 --> 00:06:03,420
this source.

57
00:06:03,650 --> 00:06:06,820
We already had these images located in our images folder.

58
00:06:06,830 --> 00:06:11,270
So just type in image slash about one dodgy RPG.

59
00:06:11,300 --> 00:06:12,640
That's the name of the first image

60
00:06:23,180 --> 00:06:24,140
and this one will be

61
00:06:26,980 --> 00:06:40,760
about to dodge RPG.

62
00:06:40,920 --> 00:06:47,720
And when you press refresh after saving all the images will be there next just go ahead and change the

63
00:06:47,720 --> 00:06:49,370
names underneath each image

64
00:06:53,680 --> 00:06:54,950
and we don't need the job titles.

65
00:06:54,950 --> 00:06:56,300
I'm just going to get rid of that

66
00:07:12,130 --> 00:07:15,740
and save and refresh.

67
00:07:16,860 --> 00:07:17,120
OK.

68
00:07:17,160 --> 00:07:20,850
That's all the changes we need to implement for the about page.

69
00:07:20,850 --> 00:07:27,060
So just remember to save your changes and then refresh your browser to preview the updated file.