1
00:00:00,000 --> 00:00:03,300
Let's go ahead now and add
the gallery to our homepage.

2
00:00:03,300 --> 00:00:05,610
Now I know that in
a demo site here,

3
00:00:05,610 --> 00:00:08,910
you can see I created
a services section,

4
00:00:08,910 --> 00:00:10,620
but of a sudden not
to do the same thing

5
00:00:10,620 --> 00:00:12,780
because it's actually very,

6
00:00:12,780 --> 00:00:14,040
very straightforward and I

7
00:00:14,040 --> 00:00:15,270
don't want to waste
too much time

8
00:00:15,270 --> 00:00:18,620
teaching you the same
thing over and over again.

9
00:00:18,615 --> 00:00:20,105
Basically, if you want to

10
00:00:20,100 --> 00:00:21,480
build out this same
kind of section,

11
00:00:21,480 --> 00:00:23,090
you will have your
white background

12
00:00:23,085 --> 00:00:24,665
and you will have three columns.

13
00:00:24,660 --> 00:00:28,010
The first column here would
all be headline or services.

14
00:00:28,005 --> 00:00:29,825
You will have the next
column that will use

15
00:00:29,820 --> 00:00:32,250
the inner section element
for the three columns.

16
00:00:32,250 --> 00:00:34,430
And then you can simply
repeat that same section

17
00:00:34,425 --> 00:00:37,205
for the monetary
columns down here.

18
00:00:37,200 --> 00:00:41,660
Now the element I used that
has the image right here,

19
00:00:41,660 --> 00:00:45,080
the headline, it's the info box.

20
00:00:45,080 --> 00:00:48,610
You will find it on the
UN essential add-ons.

21
00:00:48,605 --> 00:00:50,245
So it's the one right here on

22
00:00:50,240 --> 00:00:53,950
the and social add-ons
you will see in full box.

23
00:00:53,945 --> 00:00:55,405
And it's the one variety,

24
00:00:55,400 --> 00:00:57,550
so you simply drag,
drop it inside.

25
00:00:57,545 --> 00:01:00,125
And now here you can
choose your image.

26
00:01:00,125 --> 00:01:02,155
You will add the tide tool,

27
00:01:02,150 --> 00:01:03,740
the content in there and so on.

28
00:01:03,740 --> 00:01:06,680
So you can think of
this as an assignment

29
00:01:06,680 --> 00:01:10,690
if you want to build out
a similar structural.

30
00:01:10,685 --> 00:01:12,145
But I'm gonna go ahead now and

31
00:01:12,140 --> 00:01:14,900
create our gallery instead.

32
00:01:14,900 --> 00:01:18,140
For the gallery, it's
actually not a gallery,

33
00:01:18,140 --> 00:01:19,970
but more of an image carousel.

34
00:01:19,970 --> 00:01:22,160
So I'm gonna go to
general right here.

35
00:01:22,160 --> 00:01:25,010
And then you see we have the
image carousel right here.

36
00:01:25,010 --> 00:01:27,380
Click drag, drop it inside.

37
00:01:27,380 --> 00:01:29,990
And I'm gonna choose on images.

38
00:01:29,990 --> 00:01:33,500
And then I do have six
images I have selected.

39
00:01:33,500 --> 00:01:35,660
Let me just take
a quick glance at

40
00:01:35,660 --> 00:01:40,070
my other screen right here.

41
00:01:40,070 --> 00:01:41,780
I have this image, this image,

42
00:01:41,780 --> 00:01:43,250
this image in here as well,

43
00:01:43,250 --> 00:01:45,230
this one That's four.

44
00:01:45,230 --> 00:01:48,500
I also have this one from
Cengage and this one from

45
00:01:48,500 --> 00:01:50,270
Verbit lot J or K. Let me go

46
00:01:50,270 --> 00:01:52,530
ahead now and create a gallery.

47
00:01:52,534 --> 00:01:55,134
Now the trick here is that
all these images have

48
00:01:55,130 --> 00:01:58,790
the exact same height of
800 pixels as you can see,

49
00:01:58,790 --> 00:02:01,820
and also the width
of 1200 pixels.

50
00:02:01,820 --> 00:02:03,290
So whenever you're adding

51
00:02:03,290 --> 00:02:05,340
images to your
gallery or carousel,

52
00:02:05,344 --> 00:02:07,284
make sure tried to
make sure that they're

53
00:02:07,280 --> 00:02:10,280
as close as possible in
terms of dimensions.

54
00:02:10,280 --> 00:02:12,440
They didn't have to be exactly,

55
00:02:12,440 --> 00:02:13,940
but they shouldn't
differ by more than,

56
00:02:13,940 --> 00:02:16,070
let's say five or ten
pixels, give or take.

57
00:02:16,070 --> 00:02:17,090
So try to make

58
00:02:17,090 --> 00:02:19,700
the images had the same
size as much as possible.

59
00:02:19,700 --> 00:02:22,550
So we're going to insert
that into the gallery.

60
00:02:22,550 --> 00:02:25,250
And we're going to
choose a full size.

61
00:02:25,250 --> 00:02:28,100
Slaves to show would
be two at a time.

62
00:02:28,100 --> 00:02:30,950
Slice to scroll
would also be two.

63
00:02:30,950 --> 00:02:33,110
You don't want to stretch
images because this

64
00:02:33,110 --> 00:02:35,180
could lead to them
being blurred.

65
00:02:35,179 --> 00:02:38,619
So we'll keep that on no
navigation hours endorsed?

66
00:02:38,614 --> 00:02:41,814
Yes. Or you could
just go with dots.

67
00:02:41,810 --> 00:02:43,520
They'll show down here,

68
00:02:43,520 --> 00:02:46,570
which is also a possible.

69
00:02:46,565 --> 00:02:48,475
Then the link you
could link them to

70
00:02:48,470 --> 00:02:51,100
a media file if you want to.

71
00:02:51,095 --> 00:02:53,395
But I'm not going to link them.

72
00:02:53,390 --> 00:02:54,830
I'll just leave them on.

73
00:02:54,830 --> 00:02:57,710
The caption will go with titles.

74
00:02:57,710 --> 00:03:01,780
So there'll be the titles of
each image being displayed.

75
00:03:01,775 --> 00:03:03,425
And there it is.

76
00:03:03,425 --> 00:03:05,935
All right, so I'm going to
edit this session right now.

77
00:03:05,930 --> 00:03:10,690
Choose a full width and
then columns gap, no gap.

78
00:03:10,685 --> 00:03:12,445
And there you go.

79
00:03:12,440 --> 00:03:14,950
I'm gonna go ahead and
I'll simply updates.

80
00:03:14,945 --> 00:03:18,775
And let us view our page.

81
00:03:18,770 --> 00:03:21,940
I can scroll down here.

82
00:03:21,935 --> 00:03:24,115
And there you go.

83
00:03:24,110 --> 00:03:26,720
That is our gallery light there.

84
00:03:26,720 --> 00:03:28,870
One thing you could also do,

85
00:03:28,865 --> 00:03:30,745
you can think of this
as an assignment.

86
00:03:30,740 --> 00:03:36,040
You could add the
bottom for Instagram.

87
00:03:36,035 --> 00:03:38,515
So basically what you
could do is again,

88
00:03:38,510 --> 00:03:41,200
you go over here to
edit with Elementor.

89
00:03:41,195 --> 00:03:44,635
If you have an Instagram
page on Instagram link,

90
00:03:44,630 --> 00:03:47,240
you could just simply
come down in here.

91
00:03:47,240 --> 00:03:49,910
You just drag your button,

92
00:03:49,910 --> 00:03:51,760
you drop it right here,

93
00:03:51,755 --> 00:03:53,425
and then just simply
customize and say

94
00:03:53,420 --> 00:03:55,570
view our pictures on Instagram.

95
00:03:55,565 --> 00:03:57,175
And then if can add the link to

96
00:03:57,170 --> 00:03:59,690
Instagram if you
wanted to do that.

97
00:03:59,690 --> 00:04:02,540
So again, you do have the
option to do that as well.

98
00:04:02,540 --> 00:04:04,570
We're going to go
ahead and delete.

99
00:04:04,565 --> 00:04:07,225
One more thing just
to ensure is for

100
00:04:07,220 --> 00:04:11,020
your image carousel right here,

101
00:04:11,015 --> 00:04:15,865
you will have the additional
options for autoplay.

102
00:04:15,860 --> 00:04:19,030
Pause on Havas, pause
on interaction.

103
00:04:19,025 --> 00:04:20,645
So pause on hover.

104
00:04:20,645 --> 00:04:22,655
You can choose know for that one

105
00:04:22,655 --> 00:04:25,535
just to ensure that the
energies are always colon by.

106
00:04:25,535 --> 00:04:28,195
Of course, you can set
your infinite loop.

107
00:04:28,190 --> 00:04:30,530
Your direction may be left
or maybe go to right.

108
00:04:30,530 --> 00:04:33,260
Instead. You have
all these options

109
00:04:33,260 --> 00:04:35,690
and it's really all
very subjective.

110
00:04:35,690 --> 00:04:39,420
Okay, so I'm gonna stick
with left, just updates.

111
00:04:39,424 --> 00:04:41,484
And there it is.

112
00:04:41,480 --> 00:04:44,240
So that's it for adding
our gallery Germany.

113
00:04:44,240 --> 00:04:47,770
When next video available
now, add our blog.

114
00:04:47,765 --> 00:04:49,625
I'll see you then.