1
00:00:00,690 --> 00:00:04,050
Now what I'm going to do is that I'm going to create a new page, which is the shop page.

2
00:00:04,410 --> 00:00:08,160
So the shop page is going to contain all products that we have.

3
00:00:08,640 --> 00:00:14,610
So the shop page is going to have a navigation bar, the same navigation bar, of course, and also

4
00:00:14,610 --> 00:00:17,730
it's going to have the footer, but the content is going to be different.

5
00:00:17,730 --> 00:00:22,770
So the content is going to be all the products that we have in our e-commerce shop.

6
00:00:23,310 --> 00:00:27,390
So first of all, here, I'm going to create a new file, make sure that you are in this area.

7
00:00:27,910 --> 00:00:32,100
And then I'm going to create a new file called Shop Dot Email.

8
00:00:33,590 --> 00:00:38,570
And since the code is going to be similar, I'm going to copy some code that we already created in the

9
00:00:38,570 --> 00:00:39,650
index from the index.

10
00:00:40,130 --> 00:00:41,810
So I'm going to hit the number to the index.

11
00:00:42,290 --> 00:00:45,670
And from the index first I'm going to copy this path.

12
00:00:46,670 --> 00:00:53,030
This path to the body from the beginning, all the way through the opening track of the body.

13
00:00:53,600 --> 00:00:55,040
And then I'm going to be sit in the shop.

14
00:00:56,060 --> 00:00:58,730
And here in the shop, I'm going to change the title.

15
00:00:58,760 --> 00:01:02,300
I'm going to say, here, shop here.

16
00:01:02,300 --> 00:01:03,260
I'm going to say shop.

17
00:01:04,400 --> 00:01:08,060
And here I'm going to say in the index, I'm going to say instead of document, I'm going to say home.

18
00:01:12,960 --> 00:01:15,570
The next thing that I'm going to do is that I'm going to copy.

19
00:01:16,540 --> 00:01:23,110
I'm going to copy the lower part, which is the script and the closing track of their body and the closing

20
00:01:23,110 --> 00:01:24,190
attack of the female.

21
00:01:24,190 --> 00:01:28,240
So I'm going to copy these feet and then I'm going to piece them in the shop.

22
00:01:28,810 --> 00:01:34,480
So in the shop here, I'm going to give myself some space and then I'm going to basically scream.

23
00:01:35,410 --> 00:01:38,080
So now this is the shop -- lady.

24
00:01:38,080 --> 00:01:40,080
Save and leave me up in the shop page.

25
00:01:40,100 --> 00:01:45,100
So in the browser I'm going to go and instead of index, I'm going to say I'm going to say, here,

26
00:01:45,490 --> 00:01:46,970
shop that female.

27
00:01:47,830 --> 00:01:50,020
And as you can see, the content is empty.

28
00:01:50,350 --> 00:01:52,510
So we need to adhere to the negation bar.

29
00:01:52,870 --> 00:01:58,040
So I'm going to head over back to the index and then in the index I'm going to copy the navigation bar.

30
00:01:58,060 --> 00:02:03,510
I'm going to close this navigation bar and then I'm going to copy the navigation bar, and then I'm

31
00:02:03,510 --> 00:02:04,630
going to basically in the shop.

32
00:02:05,680 --> 00:02:06,670
So I'm going to sit here.

33
00:02:09,820 --> 00:02:12,970
And then I'm going to save and I'm going at this, this, this.

34
00:02:12,970 --> 00:02:13,750
Let me refresh.

35
00:02:14,320 --> 00:02:19,660
And as you can see now, we have a navigation bar in the shop that we have this navigation bar.

36
00:02:20,170 --> 00:02:21,490
Let's also add the footer.

37
00:02:22,180 --> 00:02:24,670
So I'm going to again heading over back to the index.

38
00:02:25,270 --> 00:02:28,090
And from the index I'm going to go to the footer.

39
00:02:28,720 --> 00:02:33,780
Remember, this is the footer, so I'm going to close the footer and then I'm going to copy the photo

40
00:02:33,790 --> 00:02:34,270
code.

41
00:02:35,470 --> 00:02:38,410
Then I'm going to sit here below the navigation bar.

42
00:02:39,130 --> 00:02:40,060
I'm going to sit here.

43
00:02:43,740 --> 00:02:44,730
And then I'm going to save.

44
00:02:45,570 --> 00:02:46,590
Let me close this.

45
00:02:49,780 --> 00:02:50,740
Linen closet.

46
00:02:51,580 --> 00:02:54,610
And Lamy also close the navigation bar one more time.

47
00:02:55,300 --> 00:02:58,480
So we have here they now have a bar and we have it for Our Lady.

48
00:02:58,480 --> 00:03:03,610
Now click on file and save all Allegheny your three fresh.

49
00:03:04,120 --> 00:03:06,160
So the shop now will have the following.

50
00:03:06,520 --> 00:03:09,460
It will have the navigation bar at the end, it will have the footer.

51
00:03:09,910 --> 00:03:11,770
However, we want to add content.

52
00:03:12,160 --> 00:03:16,030
So the content is going to be is going to be products.

53
00:03:16,330 --> 00:03:20,380
So remember, if you go back to the homepage, you will find that we have your products.

54
00:03:20,770 --> 00:03:24,540
So what I'm what I'm going to do is that I'm going to display all of the products that we have.

55
00:03:24,560 --> 00:03:31,450
So instead of this playing for products, I'm going to display so many products, almost all of the

56
00:03:31,450 --> 00:03:32,290
products that we have.

57
00:03:32,800 --> 00:03:35,280
Therefore, I'm going to copy the codes from the index.

58
00:03:35,320 --> 00:03:40,990
Remember, if you go to the index one more time, you'll find that we have the featured section, which

59
00:03:40,990 --> 00:03:47,350
is this I'm going to copy it and then I'm going to be set between between the navigation bar and the

60
00:03:47,350 --> 00:03:47,670
future.

61
00:03:47,680 --> 00:03:48,520
I'm going to sit here.

62
00:03:50,350 --> 00:03:56,050
And now if I if I save and heading over to the browser and refresh.

63
00:03:57,110 --> 00:03:58,210
And let me go.

64
00:03:58,340 --> 00:03:59,630
Let me go now to the shop.

65
00:03:59,630 --> 00:04:05,510
I'm going to go to the shop that which G.M. so now has a shop that it -- you'll find that we have

66
00:04:06,000 --> 00:04:12,590
a navigation bar and we have four products and we have the footer and we don't want to display only

67
00:04:12,650 --> 00:04:14,050
for four products.

68
00:04:14,060 --> 00:04:16,730
And instead we want to display all of the products.

69
00:04:17,030 --> 00:04:18,380
So how can we do this?

70
00:04:18,680 --> 00:04:20,750
How can we how would we do this?

71
00:04:21,230 --> 00:04:23,920
To do this, we can copy.

72
00:04:23,970 --> 00:04:30,500
Remember, we can't copy these products in the shop here we have this draw.

73
00:04:31,010 --> 00:04:32,840
And inside this draw we have these products.

74
00:04:33,230 --> 00:04:45,200
So so you can copy these products from here all the way to this and then you can based that once, twice

75
00:04:45,950 --> 00:04:46,790
and three times.

76
00:04:47,300 --> 00:04:53,000
Now, if you save and refresh, you'll find that we will have now so many products.

77
00:04:53,000 --> 00:05:00,800
As you can see, we will have four, five, six, seven, eight, nine, ten, 11, 12, 13, 14, 15,

78
00:05:00,800 --> 00:05:01,400
16.

79
00:05:01,730 --> 00:05:07,910
So we have 16 products and we can add as many products as you as we want, but we need to work first

80
00:05:07,910 --> 00:05:08,600
on the design.

81
00:05:08,930 --> 00:05:15,080
So you can see here we have a problem with the design, the design, the the area here, the starting

82
00:05:15,080 --> 00:05:18,650
area of the products is behind the navigation bar.

83
00:05:18,650 --> 00:05:25,160
So we need to push this in order to be displayed below the navigation bar, not behind the navigation

84
00:05:25,160 --> 00:05:25,370
bar.

85
00:05:26,000 --> 00:05:28,400
And to do this, we can here.

86
00:05:29,460 --> 00:05:30,270
Increase.

87
00:05:31,420 --> 00:05:33,730
We can't increase the margin.