WEBVTT

00:00:06.990 --> 00:00:13.740
In this video we are going to style our headline and subhead line using a plugin called Easy Google

00:00:13.740 --> 00:00:14.960
fonts.

00:00:15.120 --> 00:00:17.440
So let's install our plugin.

00:00:17.940 --> 00:00:26.330
So we're going to go to our dashboard and then ligations and then click on on you.

00:00:27.570 --> 00:00:33.290
So we're going to search easy Google fonts.

00:00:33.840 --> 00:00:34.600
So here it is.

00:00:34.620 --> 00:00:36.370
Let's install it.

00:00:37.950 --> 00:00:41.920
And now let's activates our plugin.

00:00:43.770 --> 00:00:50.730
So to use the easy Google fonts plug into style and elements or a specific class.

00:00:50.970 --> 00:00:56.620
First of all we would need to create a font control for that class.

00:00:56.880 --> 00:01:05.600
So to do this we're going to go to our dashboard and then go to settings and then Google fonts.

00:01:05.680 --> 00:01:06.160
OK.

00:01:06.390 --> 00:01:10.300
So we can choose a name for our control or font control.

00:01:10.420 --> 00:01:16.080
OK so I'll give it the same name of the class.

00:01:16.140 --> 00:01:20.310
OK so for the headline I'm going to call it a headlight.

00:01:21.850 --> 00:01:28.690
OK and then we are going to click and create font control and then we need to Arbys CSF selector.

00:01:28.870 --> 00:01:29.470
OK.

00:01:29.510 --> 00:01:34.870
For our elements for our head line it's going to be but headline.

00:01:35.830 --> 00:01:36.740
Okay.

00:01:36.910 --> 00:01:43.470
And now let's save and if we go to appearance customize

00:01:49.160 --> 00:01:53.490
then we will see a new section inside our customized menu.

00:01:53.520 --> 00:01:54.850
It's typographic.

00:01:55.230 --> 00:01:59.030
So if we click on it we've got two sections there.

00:01:59.220 --> 00:02:06.390
The default epigraphy those we can use to style the default elements like paragraphs headings and so

00:02:06.390 --> 00:02:06.760
on.

00:02:06.900 --> 00:02:07.770
OK.

00:02:08.430 --> 00:02:14.430
And we of course the theme is epigraphy Where are we going to find the font controls that we have created

00:02:14.440 --> 00:02:14.630
.

00:02:14.820 --> 00:02:18.170
OK so now we want to style our headline.

00:02:18.330 --> 00:02:20.890
So we are going to use this font control.

00:02:21.290 --> 00:02:22.210
OK.

00:02:22.920 --> 00:02:33.870
So if you click on edits once that we can see that we can change the styles appearance and positioning

00:02:33.880 --> 00:02:34.290
.

00:02:34.680 --> 00:02:38.960
OK so let's start with the styles.

00:02:40.890 --> 00:02:45.470
Let's go to our avows page so that we can see the live preview.

00:02:45.530 --> 00:02:47.830
OK.

00:02:48.200 --> 00:02:48.600
All right.

00:02:48.600 --> 00:02:54.300
Now let's change the fund family and let's set it to Roboto for example.

00:02:54.810 --> 00:02:55.800
OK.

00:02:56.400 --> 00:03:01.090
And also let's set the font style to regular.

00:03:02.070 --> 00:03:02.670
OK.

00:03:02.670 --> 00:03:07.360
Now let's move to appearance and let's change the font color.

00:03:08.040 --> 00:03:11.830
So I want to say this to the same blue color we see in the menu.

00:03:11.940 --> 00:03:17.980
And to do that I'm going to use the color zula add on as we did in the census jobs.

00:03:18.240 --> 00:03:19.060
OK.

00:03:19.560 --> 00:03:23.170
If you don't have callers just go to Google and you can sort of from there.

00:03:23.580 --> 00:03:24.630
OK.

00:03:24.630 --> 00:03:29.130
So by clicking on the first time we can make sure that the call Epica is active.

00:03:29.430 --> 00:03:31.590
And then we can pick any color we want.

00:03:31.590 --> 00:03:38.190
From our Web page so we're going to over on the blue collar and it's click and it's now the color code

00:03:38.340 --> 00:03:45.340
has me copy it to my clipboard and then we can pastes here by using Control V or command V.

00:03:45.990 --> 00:03:50.240
Now we can see this our title has got this nice blue color.

00:03:51.030 --> 00:03:51.660
OK.

00:03:51.660 --> 00:04:01.240
Now let's move to the font size and let's change that to fifty six big cells for example.

00:04:01.710 --> 00:04:02.410
OK.

00:04:02.490 --> 00:04:05.650
And also it is change the line height.

00:04:07.110 --> 00:04:09.070
It's a two point eight.

00:04:09.840 --> 00:04:11.140
And the less spacing

00:04:12.930 --> 00:04:16.720
.

00:04:19.870 --> 00:04:20.880
OK live.

00:04:21.330 --> 00:04:22.470
OK.

00:04:23.220 --> 00:04:28.820
So now we've got our headline styled using Google phones.

00:04:28.850 --> 00:04:34.270
All right now we are ready to move to the subject line and do exactly the same thing.

00:04:34.410 --> 00:04:34.870
OK.

00:04:35.160 --> 00:04:37.840
So first let's save and publish.

00:04:38.760 --> 00:04:41.970
So we're going to create a new front control for our subject line.

00:04:42.240 --> 00:04:45.450
So let's go back to our dashboard

00:04:48.550 --> 00:04:54.520
and then go to settings and then Google once.

00:04:55.070 --> 00:05:01.930
Are we going to create a new phone's control by clicking on creates and you from phone's control.

00:05:02.980 --> 00:05:03.340
OK.

00:05:03.370 --> 00:05:08.410
And we're going to name it subject line.

00:05:10.960 --> 00:05:11.520
OK.

00:05:11.860 --> 00:05:14.030
And we need to add a CCS Alexa.

00:05:14.200 --> 00:05:20.240
So the seats are selected for the subway line is going to be dot Sabahi light.

00:05:21.100 --> 00:05:22.370
OK.

00:05:23.560 --> 00:05:29.280
So this is the same CSSA Alexa we have chosen earlier for our subheading.

00:05:29.430 --> 00:05:30.170
OK.

00:05:30.190 --> 00:05:32.040
So let's save our phones Patrol

00:05:35.370 --> 00:05:39.730
OK and let's go back to parents customize

00:05:41.960 --> 00:05:43.740
.

00:05:45.520 --> 00:05:53.280
Let's go to typographic and theme typography and we can see that our new fonts control.

00:05:53.530 --> 00:05:58.960
So if we click on Edie's phones then we can style Our some headlines.

00:05:58.960 --> 00:06:05.320
So just click on the avows page so that we can see the life review and then we're going to start styling

00:06:05.350 --> 00:06:06.880
our subject line.

00:06:06.910 --> 00:06:16.520
So first of all let's change the phone's family to robots as well.

00:06:18.190 --> 00:06:19.030
OK

00:06:24.900 --> 00:06:30.290
that's a different style to regula.

00:06:31.420 --> 00:06:35.090
And let's go to appearance.

00:06:35.620 --> 00:06:46.440
So I'm going to change the font color to 5 1 5 1 5 1.

00:06:46.870 --> 00:06:58.430
Ok lace black color and I'm going to change the font size to 19 for example.

00:06:59.770 --> 00:07:01.940
OK.

00:07:03.160 --> 00:07:12.580
And the line heights this is two points eights on the sets.

00:07:14.180 --> 00:07:23.160
OK I'm going to go back to styles and change the font style to 100.

00:07:23.380 --> 00:07:24.110
OK.

00:07:24.400 --> 00:07:25.400
That looks better.

00:07:25.810 --> 00:07:26.380
OK.

00:07:26.380 --> 00:07:29.540
So now we've got our Sabahan headline style as well.

00:07:29.680 --> 00:07:31.590
OK.

00:07:33.250 --> 00:07:39.080
OK now let's save and publish and let's have a look at our page.

00:07:41.180 --> 00:07:41.960
OK.

00:07:42.280 --> 00:07:45.480
We can see that's the headline is some headline.

00:07:45.700 --> 00:07:48.780
They are not fully censored.

00:07:49.180 --> 00:07:55.120
And the reason is because the row that we have created at the moment is not seeking the full width of

00:07:55.120 --> 00:07:56.120
the page.

00:07:56.140 --> 00:07:56.880
OK.

00:07:57.130 --> 00:08:01.460
So to change this we're going to go back to our page

00:08:04.780 --> 00:08:17.250
so dashboard pages all pages that are going to go to the About page and selects the Arrau.

00:08:17.500 --> 00:08:21.560
OK so make sure you select the row not the Visual Editor.

00:08:21.920 --> 00:08:23.060
OK.

00:08:23.890 --> 00:08:27.540
And we're going to click on edits row.

00:08:29.320 --> 00:08:30.180
OK.

00:08:30.290 --> 00:08:34.720
And I'm going to go to design or lay out

00:08:37.480 --> 00:08:48.850
and we're going to set the rolling out to full with stretched and know if we save and update now if

00:08:48.850 --> 00:08:52.810
we refresh the page we can see that's the

00:08:55.390 --> 00:09:02.710
headline headline are going to be censored.

00:09:02.800 --> 00:09:09.400
OK that looks better.

00:09:09.410 --> 00:09:09.910
All right.

00:09:10.090 --> 00:09:13.960
In the next video we're going to add some more content to our page.

00:09:14.020 --> 00:09:20.440
So we're going to create a new row on inside there so we can create three columns and in each column

00:09:20.520 --> 00:09:25.180
we're going to have a nice logo with some sense of text.

00:09:25.180 --> 00:09:25.500
All right