WEBVTT 00:00.150 --> 00:06.600 At this point you know a lot about creating a WordPress Web site you could go out and start editing 00:06.600 --> 00:12.480 your own pages adding blog content adding pages like about page and adding all the information for your 00:12.480 --> 00:18.360 own Web site later on in the course we're going to be diving deeper into some more specific pages and 00:18.360 --> 00:24.120 things you'll need to know about Wordpress and about creating things like a contact page with a contact 00:24.120 --> 00:29.730 form in the next section we're going to be looking at all kinds of plug ins that I recommend to make 00:29.730 --> 00:35.970 sure that your website is up and running properly including things like security plugins comment plug 00:35.970 --> 00:40.970 ins and all kinds of plugins that help make your website run faster and smoother. 00:40.980 --> 00:47.160 But the one thing that I want to talk about right now before we get to that is having a responsive design 00:47.250 --> 00:54.440 responsive design means that your web site looks good both on a browser but also a mobile device. 00:54.450 --> 01:00.630 One way you can look and see how your web site looks on a mobile device is one by looking at it on your 01:00.630 --> 01:01.140 phone. 01:01.200 --> 01:08.940 If you have a smartphone or by opening up your Web site in a new tab and making that browser small you 01:08.940 --> 01:14.430 can see already some weird things happening with the titles that we created in the mobile version. 01:14.430 --> 01:17.690 Most modern themes are created so that they're responsive. 01:17.700 --> 01:23.230 Meaning when you increase the size of the browser or whatever viewer you're looking on your Web site 01:23.550 --> 01:24.810 it changes the design. 01:24.810 --> 01:30.510 You can see that the header shrinks the menu turns into one of these dropdown menus rather than across 01:30.510 --> 01:31.260 the top. 01:31.260 --> 01:36.870 The images actually shrink down rather than cutting off on the side of the device or the browser. 01:36.870 --> 01:43.440 So this theme is already very mobile friendly but also looking at the mobile friendly version will give 01:43.440 --> 01:46.310 you ideas for how to make sure it looks best. 01:46.320 --> 01:52.290 Another way that you can do it right within this theme is from the dashboard good appearance customize 01:52.470 --> 01:55.500 and you can see these controls down here on the bottom left. 01:55.530 --> 01:57.060 You have the desktop version. 01:57.180 --> 02:03.660 The tablet version and the mobile version and it's all actually interactive so you can see what it looks 02:03.660 --> 02:08.510 like and play around with what it would look like on a phone for most of the content. 02:08.520 --> 02:10.480 It actually looks pretty good. 02:10.500 --> 02:12.460 Let's just see one of our posts. 02:12.750 --> 02:18.330 All the photos look pretty good but it will also show you where the photo is in terms of the tax we 02:18.420 --> 02:22.570 would probably want to move this photo up above the supply list. 02:23.070 --> 02:28.070 The one thing that I'm seeing the big issue is the home page where this title. 02:28.080 --> 02:30.590 It just doesn't look good on mobile devices. 02:30.720 --> 02:32.930 So we're probably going to have to change this. 02:32.940 --> 02:37.720 So using these controls down here while editing your site is a good thing to do. 02:37.800 --> 02:43.380 What if you use a theme that isn't mobile friendly or doesn't have this option where you can see the 02:43.380 --> 02:45.290 mobile version of your web site. 02:45.330 --> 02:50.850 Thankfully there's different plug ins to make your Web site automatically mobile friendly or responsive. 02:50.880 --> 02:56.990 And there's one right within jet pack sort of the go to plug in that we installed already. 02:57.000 --> 03:02.850 So if you go to the jetpack menu and click on settings and then go down to appearance you see these 03:02.850 --> 03:04.410 tabs at the top. 03:04.440 --> 03:08.250 These are the different tools and plug ins that come with jet pack. 03:08.250 --> 03:12.980 So let's go down to appearance if we scroll down we'll see mobile theme. 03:12.990 --> 03:19.650 So if we turn this on then it's going to make our Web site more responsive and it will optimize it for 03:19.650 --> 03:21.360 smartphones and tablets. 03:21.360 --> 03:27.420 So if your it isn't already responsive you can make it more responsive right within the jetpack plug 03:27.420 --> 03:27.730 in.