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)
410 lines
14 KiB
Text
410 lines
14 KiB
Text
1
|
||
00:00:00,000 --> 00:00:04,600
|
||
使用 WordPress 区块编辑器创建文章和页面。
|
||
Creating posts and pages with the WordPress Block Editor.
|
||
|
||
2
|
||
00:00:04,600 --> 00:00:11,360
|
||
今天,我们将深入探讨使用强大的 WordPress 区块编辑器进行内容创作的核心。
|
||
Today, we're diving into the heart of content creation using the powerful WordPress Block Editor.
|
||
|
||
3
|
||
00:00:11,360 --> 00:00:22,160
|
||
本课的学习成果包括:定义区块编辑器、浏览区块编辑器界面、区分内容编辑区域与设置边栏、
|
||
The learning outcomes for this lesson are defining the Block Editor, navigating the Block Editor interface, differentiating between the content editing area and the settings sidebar,
|
||
|
||
4
|
||
00:00:22,160 --> 00:00:29,360
|
||
创建页面和文章,以及最后,使用区块、区块样板和列表视图。
|
||
creating a page and post, and lastly, using blocks, patterns, and the list view.
|
||
|
||
5
|
||
00:00:30,000 --> 00:00:37,000
|
||
WordPress 区块编辑器允许您使用区块构建站点,无需代码。
|
||
The WordPress Block Editor allows you to build your site with blocks, no code required.
|
||
|
||
6
|
||
00:00:38,000 --> 00:00:43,600
|
||
如前所述,要创建文章或页面,请登录您的 WordPress 仪表盘。
|
||
As seen before, to create a post or page, log into your WordPress dashboard.
|
||
|
||
7
|
||
00:00:43,600 --> 00:00:49,200
|
||
从仪表盘,在左侧菜单中导航到文章或页面。
|
||
From the dashboard, navigate to either posts or pages in the left-hand menu.
|
||
|
||
8
|
||
00:00:49,200 --> 00:00:55,400
|
||
让我们创建一个新页面,以便更仔细地查看区块编辑器界面。
|
||
Let's create a new page to take a closer look at the Block Editor interface.
|
||
|
||
9
|
||
00:00:55,400 --> 00:01:00,800
|
||
一旦我们添加了新页面,我们还可以为页面提供一个合适的标题。
|
||
Once we add a new page, we can also provide a suitable title for the page.
|
||
|
||
10
|
||
00:01:03,400 --> 00:01:05,200
|
||
当您点击插入器时,
|
||
When you click on the Inserter,
|
||
|
||
11
|
||
00:01:05,200 --> 00:01:09,600
|
||
您将能够添加一系列不同的区块来构建您的页面。
|
||
you will be able to add a range of different blocks to build your page.
|
||
|
||
12
|
||
00:01:09,600 --> 00:01:16,600
|
||
区块可以是任何东西,从段落、图像、列、画廊、定价数据表等等。
|
||
Blocks can be anything from paragraphs, images, columns, galleries, pricing tables, and more.
|
||
|
||
13
|
||
00:01:16,600 --> 00:01:19,600
|
||
区块模式是另一个很棒的功能。
|
||
Block Patterns is another great feature.
|
||
|
||
14
|
||
00:01:19,600 --> 00:01:26,200
|
||
这些是预设的区块群组或预设计的区块,您可以快速添加以构建整个部分,
|
||
These are set groups of blocks or pre-designed blocks that you can quickly add to build entire sections
|
||
|
||
15
|
||
00:01:26,200 --> 00:01:28,800
|
||
然后修改它以满足您的需求。
|
||
and then modify it to meet your needs.
|
||
|
||
16
|
||
00:01:28,800 --> 00:01:33,800
|
||
在右侧,区块模式旁边,我们可以添加媒体。
|
||
And on the right, next to Patterns, we can add media.
|
||
|
||
17
|
||
00:01:33,800 --> 00:01:39,800
|
||
首先,可以从我们的媒体库,或者从 Openverse。
|
||
Firstly, from our media library, or from Openverse.
|
||
|
||
18
|
||
00:01:39,800 --> 00:01:45,800
|
||
它们提供开放许可的媒体,可以免费使用。
|
||
They provide openly licensed media that is available to use for free.
|
||
|
||
19
|
||
00:01:46,800 --> 00:01:49,800
|
||
添加区块有多种方式。
|
||
There are multiple ways to add a block.
|
||
|
||
20
|
||
00:01:50,000 --> 00:01:56,000
|
||
第一,你可以点击左上角的插入器或页面内的插入器。
|
||
Firstly, you can click on the Inserter top left or on the Inserter within the page.
|
||
|
||
21
|
||
00:01:56,000 --> 00:02:01,000
|
||
搜索下方出现的六个区块是你最近使用的区块。
|
||
The six blocks that appear below Search will be your most recently used blocks.
|
||
|
||
22
|
||
00:02:01,000 --> 00:02:04,000
|
||
或者你可以使用正斜杠命令。
|
||
Or you can use the forward slash command.
|
||
|
||
23
|
||
00:02:04,000 --> 00:02:10,000
|
||
比如说,输入正斜杠 image,然后从我们的媒体库添加一张图片,我已经上传好了。
|
||
So let's say forward slash image and add an image from our media library, which I've already uploaded.
|
||
|
||
24
|
||
00:02:14,000 --> 00:02:19,000
|
||
接下来,我会按回车键,然后在我的段落区块中添加一些文字。
|
||
Next, I will press Enter and then add some text to my paragraph block.
|
||
|
||
25
|
||
00:02:20,000 --> 00:02:23,000
|
||
然后再添加一个段落。
|
||
And then add another paragraph.
|
||
|
||
26
|
||
00:02:26,000 --> 00:02:29,000
|
||
界面分为三个主要部分。
|
||
The interface is divided into three main sections.
|
||
|
||
27
|
||
00:02:29,000 --> 00:02:34,884
|
||
内容编辑区,用于选择区块或列表视图的左侧边栏,
|
||
The content editing area, the left sidebar for selecting blocks or the list view,
|
||
|
||
28
|
||
00:02:34,884 --> 00:02:40,000
|
||
这个我们稍后会讲到,以及右侧的设置边栏。
|
||
which we will talk about in a moment, and the settings sidebar on the right.
|
||
|
||
29
|
||
00:02:42,000 --> 00:02:48,410
|
||
右侧的设置边栏为已选中的区块提供额外的设置和选项,
|
||
The settings sidebar on the right provides additional settings and options for the selected block,
|
||
|
||
30
|
||
00:02:48,410 --> 00:02:52,000
|
||
让你能进一步设置区块的样式。
|
||
allowing you to style the block further.
|
||
|
||
31
|
||
00:02:52,000 --> 00:02:55,000
|
||
当然,每个区块将有不同的可用设置。
|
||
Each block, of course, will have different settings available.
|
||
|
||
32
|
||
00:02:59,000 --> 00:03:06,000
|
||
当你选中一个区块时,你还会看到与该特定区块相关的区块工具栏。
|
||
When you select a block, you will also see the block toolbar related to the specific block.
|
||
|
||
33
|
||
00:03:06,000 --> 00:03:09,000
|
||
在这个例子中,是段落区块。
|
||
In this case, the paragraph block.
|
||
|
||
34
|
||
00:03:09,000 --> 00:03:18,921
|
||
从左边开始,区块工具栏允许你将此区块转换为不同类型的区块,
|
||
And starting from the left, the block toolbar allows you to transform this block to a different type of block,
|
||
|
||
35
|
||
00:03:18,921 --> 00:03:26,105
|
||
将区块拖放到新位置或使用箭头重新定位区块,
|
||
drag and drop a block to a new location or use arrows to relocate a block,
|
||
|
||
36
|
||
00:03:26,105 --> 00:03:35,000
|
||
更改文本对齐方式,选择粗体、斜体,或允许你添加链接。
|
||
change the alignment of the text, select bold, italics, or allow you to add a link.
|
||
|
||
37
|
||
00:03:35,000 --> 00:03:42,000
|
||
下拉箭头允许高亮、添加脚注和其他样式选项。
|
||
The dropdown arrow allows highlighting, adding footnotes and other styling options.
|
||
|
||
38
|
||
00:03:42,000 --> 00:03:48,000
|
||
当你点击那三个垂直的点时,你会看到更多选项。
|
||
And when you click on the three vertical dots, you will see more options.
|
||
|
||
39
|
||
00:03:49,000 --> 00:03:53,000
|
||
接下来,同样重要的是要强调列表视图。
|
||
Next, it is also important to highlight the list view.
|
||
|
||
40
|
||
00:03:53,000 --> 00:04:00,000
|
||
在这个例子中,你会注意到我使用了多种区块构建了整个页面。
|
||
In this example, you will notice that I have built an entire page using a variety of blocks.
|
||
|
||
41
|
||
00:04:06,000 --> 00:04:13,000
|
||
如果我们向上滚动,可以在左上角打开列表视图。
|
||
And if we scroll up, we can open up the list view top left.
|
||
|
||
42
|
||
00:04:13,000 --> 00:04:18,000
|
||
列表视图能帮助你在内容层和嵌套区块之间导航。
|
||
The list view helps you navigate between layers of content and nested blocks.
|
||
|
||
43
|
||
00:04:18,000 --> 00:04:22,278
|
||
它是 WordPress 编辑器不可或缺的功能,
|
||
It is an indispensable feature of the WordPress editor
|
||
|
||
44
|
||
00:04:22,278 --> 00:04:25,000
|
||
让你能轻松处理站点上的区块。
|
||
that makes it easy for you to work with the blocks on your site.
|
||
|
||
45
|
||
00:04:25,000 --> 00:04:29,541
|
||
你可以查看页面上每个区块的确切顺序和结构,
|
||
You can view the exact order and structure of every block on the page,
|
||
|
||
46
|
||
00:04:29,541 --> 00:04:33,000
|
||
这对于内容繁多的页面尤其有帮助。
|
||
which is especially helpful if you have a page with a lot of content.
|
||
|
||
47
|
||
00:04:33,000 --> 00:04:37,000
|
||
你可以选择那些内部嵌套了其他区块的区块。
|
||
You can select blocks that have other blocks nested inside them.
|
||
|
||
48
|
||
00:04:37,000 --> 00:04:41,000
|
||
你可以点击并拖拽区块,将它们移动到页面的不同部分。
|
||
You can click and drag blocks to move them to a different part of the page.
|
||
|
||
49
|
||
00:04:41,000 --> 00:04:46,684
|
||
当你点击列表视图中任意区块旁边的省略号(三个点)时,
|
||
And when you click on the ellipsis, the three dots next to any block in the list view,
|
||
|
||
50
|
||
00:04:46,684 --> 00:04:49,000
|
||
会出现多种有用的选项。
|
||
there are a variety of helpful options.
|
||
|
||
51
|
||
00:04:50,000 --> 00:04:54,889
|
||
让我们回到原始页面,继续使用区块来构建页面,
|
||
Let's return to our original page and continue building the page using blocks
|
||
|
||
52
|
||
00:04:54,889 --> 00:04:58,000
|
||
以观察区块编辑器的实际运作。
|
||
to see the block editor in action.
|
||
|
||
53
|
||
00:04:58,000 --> 00:05:06,000
|
||
首先,让我们添加一个相册区块,然后从媒体库中选择三张图片。
|
||
Firstly, let's add a gallery block and then select three images from our media library.
|
||
|
||
54
|
||
00:05:12,000 --> 00:05:19,000
|
||
插入后,我会选择相册区块,点击三个垂直的点,然后选择“在后面添加”。
|
||
Once inserted, I'll select the gallery block, click on the three vertical dots and select add after.
|
||
|
||
55
|
||
00:05:19,000 --> 00:05:27,000
|
||
然后我会点击左上角的插入按钮,添加一个区块样板,即一个预先设计好的区块组。
|
||
Then I will click on the insert top left and add a pattern, a pre-designed group of blocks.
|
||
|
||
56
|
||
00:05:29,000 --> 00:05:35,000
|
||
我会选择一个推荐样板来安排一次访问。
|
||
And I will select one of the featured patterns to schedule a visit.
|
||
|
||
57
|
||
00:05:35,000 --> 00:05:40,161
|
||
然后我将打开我的列表视图,选中群组区块,
|
||
Then I will open up my list view, select the group block
|
||
|
||
58
|
||
00:05:40,161 --> 00:05:43,000
|
||
并更改文本的对齐方式。
|
||
and change the alignment of the text.
|
||
|
||
59
|
||
00:05:44,000 --> 00:05:48,000
|
||
接下来,我们来看看边栏设置。
|
||
Next, let's look at the sidebar settings.
|
||
|
||
60
|
||
00:05:49,000 --> 00:05:55,000
|
||
一旦我们选中一个区块,就可以使用边栏设置来进一步设置区块样式。
|
||
Once we select a block, we can use the sidebar settings to style the block further.
|
||
|
||
61
|
||
00:05:55,000 --> 00:05:59,000
|
||
在这个例子中,我们可以为图片添加圆角效果。
|
||
In this case, we can add a rounded effect to our image.
|
||
|
||
62
|
||
00:05:59,000 --> 00:06:06,000
|
||
我将选中我的第二段,并使用区块工具栏将文本改为粗体。
|
||
I'll select my second paragraph and use the block toolbar to change the text to bold.
|
||
|
||
63
|
||
00:06:09,000 --> 00:06:15,600
|
||
然后我将选择我的列表视图,以确保我选中了父级相册区块,
|
||
Then I will select my list view to ensure that I select my parent gallery block
|
||
|
||
64
|
||
00:06:15,600 --> 00:06:20,000
|
||
并在边栏设置中,将其从三列改为两列。
|
||
and in the sidebar settings, I will change it from having three columns to two.
|
||
|
||
65
|
||
00:06:22,000 --> 00:06:30,000
|
||
最后,我将选中我的按钮区块,并将背景颜色改为绿色。
|
||
And then finally, I will select my buttons block and change the background color to green.
|
||
|
||
66
|
||
00:06:31,000 --> 00:06:37,000
|
||
我相信你现在明白了区块编辑器的各个拼图是如何组合在一起的。
|
||
I trust you now see how the puzzle pieces of the block editor fit together.
|
||
|
||
67
|
||
00:06:37,000 --> 00:06:44,071
|
||
使用区块来添加内容,使用设置边栏来设置和编辑你的内容,
|
||
Using blocks to add content, using the setting sidebar to style and edit your content
|
||
|
||
68
|
||
00:06:44,071 --> 00:06:48,000
|
||
并使用列表视图来浏览你的内容。
|
||
and using the list view to navigate your content.
|
||
|
||
69
|
||
00:06:49,000 --> 00:06:54,000
|
||
请注意,你也可以在站点编辑器中创建和编辑页面。
|
||
Please note, you can also create and edit pages in the site editor.
|
||
|
||
70
|
||
00:06:54,000 --> 00:06:58,000
|
||
那么,我们转到父级并点击编辑。
|
||
So let's make our way to parents and click on editor.
|
||
|
||
71
|
||
00:06:58,000 --> 00:07:01,000
|
||
这当然会将我们带入站点编辑器。
|
||
And this will of course take us into the site editor.
|
||
|
||
72
|
||
00:07:01,000 --> 00:07:07,250
|
||
然后我们可以选择页面,我将打开使用区块编辑器页面,
|
||
Then we can select pages and I will open up the using the block editor page
|
||
|
||
73
|
||
00:07:07,250 --> 00:07:09,000
|
||
然后选择编辑。
|
||
and then select edit.
|
||
|
||
74
|
||
00:07:10,000 --> 00:07:13,780
|
||
在站点编辑器中,我们将内容添加到内容区块,
|
||
In the site editor, we add content to the content block
|
||
|
||
75
|
||
00:07:13,780 --> 00:07:19,000
|
||
然后它的工作方式完全相同,我们可以继续使用区块来构建页面。
|
||
and then it works exactly the same and we can keep building our page using blocks.
|
||
|
||
76
|
||
00:07:19,000 --> 00:07:23,000
|
||
在这个例子中,我将添加一个嵌入 YouTube 区块。
|
||
In this case, I will add an embed YouTube block.
|
||
|
||
77
|
||
00:07:23,000 --> 00:07:28,000
|
||
添加我的网址,然后将视频嵌入到我的页面中。
|
||
Add my URL and then embed the video into my page.
|
||
|
||
78
|
||
00:07:31,000 --> 00:07:37,000
|
||
最后,创建文章与创建页面完全一样。
|
||
To end off, creating a post is exactly the same as creating a page.
|
||
|
||
79
|
||
00:07:37,000 --> 00:07:41,000
|
||
我们使用区块来构建内容的结构。
|
||
We use blocks to build the structure of our content.
|
||
|
||
80
|
||
00:07:41,000 --> 00:07:48,000
|
||
请注意,我们会在另一节课中讲解如何添加分类、标签和特色图片。
|
||
And please note, we cover adding categories, tags and a featured image in a different lesson.
|
||
|
||
81
|
||
00:07:49,000 --> 00:07:53,400
|
||
我相信你现在对如何导航区块编辑器
|
||
I trust you now have a better understanding of navigating the block editor
|
||
|
||
82
|
||
00:07:53,400 --> 00:08:00,000
|
||
以及使用区块、设置边栏和列表视图有了更好的理解。
|
||
as well as using blocks, the setting sidebar and the list view.
|
||
|