1
00:00:07,380 --> 00:00:08,460
In this video.

2
00:00:08,460 --> 00:00:10,950
Let's talk about five ACORN.

3
00:00:12,230 --> 00:00:15,740
Favorite constant for favorite icon.

4
00:00:15,920 --> 00:00:25,490
And this is the small icon that represents a website or a web page, and it is typically displayed in

5
00:00:25,490 --> 00:00:29,930
the browser's address bar or bookmarks or the tabs.

6
00:00:30,290 --> 00:00:33,050
Let me show you an example of the five icon.

7
00:00:33,320 --> 00:00:35,720
Let's use these websites.

8
00:00:35,870 --> 00:00:38,150
Let me start with the Google.

9
00:00:38,720 --> 00:00:41,610
Over here, that is the address bar.

10
00:00:41,630 --> 00:00:48,770
You can see that we have some icon and this icon is the logo for Google.

11
00:00:49,010 --> 00:00:53,540
So five Beacon or the favorite icon represents a website.

12
00:00:53,810 --> 00:00:59,840
Likewise, the on draw website, as you can see, and likewise my own website.

13
00:00:59,840 --> 00:01:01,550
And that is the I never take.

14
00:01:01,700 --> 00:01:10,550
You can see here also that we have the icon that is the five icon, but for ours you can see that we

15
00:01:10,550 --> 00:01:17,240
have this kind of globe icon because we don't have the five icon being implemented.

16
00:01:17,600 --> 00:01:20,210
So let's see how going to use five icon.

17
00:01:20,510 --> 00:01:25,100
And in HTML, we can use five icon using couple of ways.

18
00:01:25,370 --> 00:01:27,310
One is the file type.

19
00:01:27,320 --> 00:01:37,100
We can use a file type with extension called dot IQ, or we can use image with extension PNG.

20
00:01:37,400 --> 00:01:44,300
Let's see how I'm going to use it and I'm going to use image for this and make sure that you have your

21
00:01:44,300 --> 00:01:52,520
own logo or you can use my logo and I'll provide that resource for you and I'm going to drag it and

22
00:01:52,520 --> 00:01:56,510
put it inside the folder that.

23
00:01:57,350 --> 00:02:01,370
I think I need to put it inside this particular folder.

24
00:02:03,460 --> 00:02:05,800
Uh, is that all right?

25
00:02:05,800 --> 00:02:08,979
So let me change the name to logo.

26
00:02:09,639 --> 00:02:11,350
Something like this.

27
00:02:11,590 --> 00:02:15,760
So let's see how I'm going to use this one as a five icon.

28
00:02:16,000 --> 00:02:19,840
Let's get back to the HTML template where you want to use it.

29
00:02:20,080 --> 00:02:23,930
And we are going to put it inside the head tag.

30
00:02:23,950 --> 00:02:26,220
So this one is for font.

31
00:02:26,230 --> 00:02:26,760
Awesome.

32
00:02:26,770 --> 00:02:33,880
Let me collapse it and a comment for this and how will use.

33
00:02:34,500 --> 00:02:35,430
Five icon.

34
00:02:36,420 --> 00:02:38,340
Or favorite icon.

35
00:02:38,460 --> 00:02:40,780
And it goes like this.

36
00:02:40,800 --> 00:02:42,600
We bring in the link.

37
00:02:43,460 --> 00:02:52,640
And for the relationship we are going to use icon and for the H ref we need to locate where the icon

38
00:02:52,640 --> 00:02:53,030
is.

39
00:02:53,480 --> 00:02:56,780
So you're going to use period and forward slash.

40
00:02:57,050 --> 00:02:58,970
And images.

41
00:02:58,970 --> 00:03:05,450
I think I need to put it inside the images folder which is this here.

42
00:03:06,930 --> 00:03:10,800
So that I can locate it as the logo.

43
00:03:11,220 --> 00:03:13,630
And let me remove this.

44
00:03:13,680 --> 00:03:15,510
I want to have one logo.

45
00:03:15,870 --> 00:03:19,830
All right, so the next attribute is the type.

46
00:03:20,600 --> 00:03:23,780
And we need to specify the extension.

47
00:03:24,020 --> 00:03:32,760
So it's going to be image and forward slash P and G because this image is P and G file.

48
00:03:32,780 --> 00:03:35,720
Save it and let's have a look.

49
00:03:35,750 --> 00:03:37,180
And there you go.

50
00:03:37,190 --> 00:03:41,840
You can see that we have our favorite icon as that.

51
00:03:41,930 --> 00:03:43,880
Let's continue in the next video.