studio
4cfcf09a97
Sources: video-subtitle-pipeline artifacts/beginner-wordpress-user/ - subtitles/: en, zh, bilingual SRT/ASS (100 files) - platform/: youtube SRT + bilibili BCC per video (75 files) - manifests/: per-video manifest.json (25 files) - quality/: quality reports (50 files)
279 lines
8.6 KiB
Text
279 lines
8.6 KiB
Text
1
|
|
00:00:00,000 --> 00:00:09,000
|
|
In this lesson, we are going to apply what we've learned thus far, by setting up our pages, posts, site logo and navigation menu.
|
|
|
|
2
|
|
00:00:11,000 --> 00:00:13,000
|
|
First up, let's create our pages.
|
|
|
|
3
|
|
00:00:13,000 --> 00:00:17,000
|
|
I'll make my way to pages, click on add new page.
|
|
|
|
4
|
|
00:00:17,000 --> 00:00:24,000
|
|
And then once I do that, I will be able to add or select a pattern that comes with my theme.
|
|
|
|
5
|
|
00:00:24,000 --> 00:00:26,000
|
|
And I'm using the 2024 default theme.
|
|
|
|
6
|
|
00:00:26,000 --> 00:00:31,000
|
|
So I'll go ahead and select a pattern that appeals to me.
|
|
|
|
7
|
|
00:00:31,000 --> 00:00:34,000
|
|
And name it home.
|
|
|
|
8
|
|
00:00:34,000 --> 00:00:41,000
|
|
After publishing, I'll make my way back to pages and add my next page.
|
|
|
|
9
|
|
00:00:41,000 --> 00:00:46,000
|
|
This time, I'm not going to choose a pattern and I'll name this page blog.
|
|
|
|
10
|
|
00:00:48,000 --> 00:00:53,000
|
|
Next, I'm going to create an about page and select the relevant pattern.
|
|
|
|
11
|
|
00:00:57,000 --> 00:01:03,000
|
|
And lastly, I will also create a contact page without choosing a pattern.
|
|
|
|
12
|
|
00:01:07,000 --> 00:01:09,000
|
|
Now I have my pages in place.
|
|
|
|
13
|
|
00:01:10,000 --> 00:01:15,000
|
|
So next, I'm going to make my way to settings and click on reading.
|
|
|
|
14
|
|
00:01:16,000 --> 00:01:25,000
|
|
And for my homepage display, I will select a static page and set my home page as my static home page.
|
|
|
|
15
|
|
00:01:27,000 --> 00:01:30,000
|
|
And my blog page as my posts page.
|
|
|
|
16
|
|
00:01:31,000 --> 00:01:44,000
|
|
Just a reminder, if you have selected your latest posts for your homepage display, you will modify the blog home template for this homepage or front page, as no page has been created.
|
|
|
|
17
|
|
00:01:45,000 --> 00:01:59,000
|
|
Please note, when we open up our static homepage and open the settings sidebar, we will notice that this page has been assigned to the page template or the default page template.
|
|
|
|
18
|
|
00:02:01,000 --> 00:02:08,000
|
|
And my blog page or posts page has been assigned to the blog home template and this cannot be changed.
|
|
|
|
19
|
|
00:02:10,000 --> 00:02:19,000
|
|
And then we'll also notice that my other pages have also been assigned to the general or default page template, the same as my home page.
|
|
|
|
20
|
|
00:02:23,000 --> 00:02:36,000
|
|
Next, let's shift our attention to posts and as you will notice, I've already created two posts as well as categories and tags.
|
|
|
|
21
|
|
00:02:37,000 --> 00:02:46,000
|
|
Just a reminder, categories are used to classify content into main topics or sections and tags are like labels that give specific details about content.
|
|
|
|
22
|
|
00:02:48,000 --> 00:02:52,815
|
|
As an example, I'm going to go ahead and add a new post.
|
|
|
|
23
|
|
00:02:52,815 --> 00:02:58,000
|
|
The post is about New York and then I will add some dummy content.
|
|
|
|
24
|
|
00:02:59,000 --> 00:03:05,000
|
|
Thereafter, I will open up the settings sidebar and select the relevant category.
|
|
|
|
25
|
|
00:03:06,000 --> 00:03:07,000
|
|
In this case, travel.
|
|
|
|
26
|
|
00:03:11,000 --> 00:03:14,000
|
|
And I will add a new tag, namely city.
|
|
|
|
27
|
|
00:03:16,000 --> 00:03:19,000
|
|
Lastly, I will set the featured image or the post thumbnail.
|
|
|
|
28
|
|
00:03:20,000 --> 00:03:23,000
|
|
The featured image is of course the representative image for your post.
|
|
|
|
29
|
|
00:03:25,000 --> 00:03:35,000
|
|
And once set, we can hit publish and then view our three posts with their relevant categories and tags.
|
|
|
|
30
|
|
00:03:37,000 --> 00:03:43,000
|
|
Next, let's take a closer look at the navigation menu and make our way to appearance and then click on editor.
|
|
|
|
31
|
|
00:03:44,000 --> 00:03:46,000
|
|
This will open up the site editor.
|
|
|
|
32
|
|
00:03:47,000 --> 00:03:57,000
|
|
And on the right, we will notice our homepage and if we open up our homepage, we will see the dummy content or the pattern that we added when we created the page.
|
|
|
|
33
|
|
00:03:58,000 --> 00:04:02,000
|
|
And at the top, we see the header pattern provided by our theme.
|
|
|
|
34
|
|
00:04:03,000 --> 00:04:09,000
|
|
And if we try to edit this header, we will see a message that says edit your template to edit this block.
|
|
|
|
35
|
|
00:04:10,000 --> 00:04:12,000
|
|
So let's go ahead and click on edit template.
|
|
|
|
36
|
|
00:04:13,000 --> 00:04:16,000
|
|
And now we can edit the header for the page template.
|
|
|
|
37
|
|
00:04:17,000 --> 00:04:20,000
|
|
Please note this header will also be found on the blog home template.
|
|
|
|
38
|
|
00:04:21,000 --> 00:04:29,000
|
|
So if we make any changes to this header in the page template, it will also automatically update in the blog home template.
|
|
|
|
39
|
|
00:04:30,000 --> 00:04:32,000
|
|
As we can see, we have our navigation menu top right.
|
|
|
|
40
|
|
00:04:33,000 --> 00:04:39,000
|
|
And the great thing is this navigation menu was added automatically when we created our pages.
|
|
|
|
41
|
|
00:04:40,000 --> 00:04:49,000
|
|
When we select our navigation menu and open up the list view, we will notice that the navigation items are still part of a page list.
|
|
|
|
42
|
|
00:04:50,000 --> 00:05:00,000
|
|
So to change this, click on edit in your settings sidebar to detach the page list so that you can manage navigation items individually.
|
|
|
|
43
|
|
00:05:01,000 --> 00:05:06,600
|
|
Once detached, you can use the list view to reorder navigation items.
|
|
|
|
44
|
|
00:05:06,600 --> 00:05:15,000
|
|
Or you can use the arrows of the navigation block toolbar to reposition items where you want them.
|
|
|
|
45
|
|
00:05:16,000 --> 00:05:21,000
|
|
Next, I've decided to add social links to my navigation menu.
|
|
|
|
46
|
|
00:05:22,000 --> 00:05:31,000
|
|
So when I click on the insert of the navigation block, I will insert a social icons block and then select the relevant social media platforms.
|
|
|
|
47
|
|
00:05:31,000 --> 00:05:35,000
|
|
In this case, X and Instagram.
|
|
|
|
48
|
|
00:05:36,000 --> 00:05:39,000
|
|
And don't forget to add the relevant URLs.
|
|
|
|
49
|
|
00:05:43,000 --> 00:05:53,000
|
|
When you select the navigation block, you can click on the three vertical dots in your settings sidebar to create a new menu or select one of your existing menus.
|
|
|
|
50
|
|
00:05:54,000 --> 00:06:03,000
|
|
When you select settings, you will be able to change the justification or alignment as well as the orientation of your navigation menu.
|
|
|
|
51
|
|
00:06:04,000 --> 00:06:10,000
|
|
Below that, you can also select a hamburger menu that will appear when your site is viewed on a smaller device.
|
|
|
|
52
|
|
00:06:11,000 --> 00:06:16,000
|
|
When you click on styles, you have a variety of options to style your navigation menu further.
|
|
|
|
53
|
|
00:06:17,000 --> 00:06:20,000
|
|
Next, let's talk about the site logo block.
|
|
|
|
54
|
|
00:06:21,000 --> 00:06:26,000
|
|
As you will notice, the header pattern that was provided by my theme includes a site logo block.
|
|
|
|
55
|
|
00:06:27,000 --> 00:06:33,000
|
|
Click on the site logo block to add a new image from your media library or to upload one directly from your computer.
|
|
|
|
56
|
|
00:06:34,000 --> 00:06:38,000
|
|
I will go ahead and upload a logo that I've already added to my desktop.
|
|
|
|
57
|
|
00:06:40,000 --> 00:06:43,000
|
|
And then I will enlarge it slightly.
|
|
|
|
58
|
|
00:06:44,000 --> 00:06:49,000
|
|
Next, I would also like to add my navigation menu to my footer.
|
|
|
|
59
|
|
00:06:50,000 --> 00:07:00,000
|
|
So when we scroll down, we will notice that there are some dummy content below Quick Links, which was part of my default footer pattern that came with my theme.
|
|
|
|
60
|
|
00:07:01,000 --> 00:07:12,000
|
|
So when I open the list view and select the navigation block, I can click on the three vertical dots in my settings sidebar and then select the relevant navigation menu.
|
|
|
|
61
|
|
00:07:14,000 --> 00:07:19,000
|
|
Now my navigation menus are in place in my header and footer.
|
|
|
|
62
|
|
00:07:20,000 --> 00:07:32,000
|
|
And as mentioned before, if we make our way to the blog home template, which is the template for my posts page, we will see that the header and the footer are the same.
|
|
|
|
63
|
|
00:07:35,000 --> 00:07:41,000
|
|
Once we have all these elements in place, we want to decide on an overall style for our website.
|
|
|
|
64
|
|
00:07:42,000 --> 00:07:50,000
|
|
So when we make our way to styles, you can customize the typography, colors and layout of your site.
|
|
|
|
65
|
|
00:07:51,000 --> 00:08:00,000
|
|
Or if you click on browse styles, you'll be able to see a zoomed out view of all the different style combinations that come with your theme.
|
|
|
|
66
|
|
00:08:05,000 --> 00:08:08,000
|
|
I will go ahead and select the rust style as an example.
|
|
|
|
67
|
|
00:08:12,000 --> 00:08:29,000
|
|
Now that we have our pages, posts, navigation menu, site logo and style in place, we can go ahead and start adding content to our pages and modifying some of the patterns that we've added.
|
|
|
|
68
|
|
00:08:31,000 --> 00:08:37,000
|
|
And for a page like our contact page with no pattern, we can start building from scratch.
|
|
|
|
69
|
|
00:08:38,000 --> 00:08:46,000
|
|
And to modify how we want our posts to be displayed, we need to make our way to the blog home template.
|
|
|
|
70
|
|
00:08:48,000 --> 00:09:01,000
|
|
And when we open up our blog home template, we can customize our blog page as well as the query loop block to decide how we want our blog posts or dynamic content to be displayed.
|
