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)
635 lines
15 KiB
Text
635 lines
15 KiB
Text
1
|
||
00:00:00,000 --> 00:00:02,458
|
||
我们来探索站点编辑器,
|
||
|
||
2
|
||
00:00:02,458 --> 00:00:06,928
|
||
它允许你使用区块来设计网站上的所有内容,
|
||
|
||
3
|
||
00:00:06,928 --> 00:00:10,280
|
||
从页眉到页脚,以及其间的一切。
|
||
|
||
4
|
||
00:00:10,280 --> 00:00:14,440
|
||
我们转到外观,然后点击编辑。
|
||
|
||
5
|
||
00:00:14,440 --> 00:00:16,980
|
||
这将打开站点编辑器。
|
||
|
||
6
|
||
00:00:16,980 --> 00:00:19,629
|
||
左侧是站点视图边栏,
|
||
|
||
7
|
||
00:00:19,629 --> 00:00:24,927
|
||
这个精巧的工具让你能深入网站的关键部分,
|
||
|
||
8
|
||
00:00:24,927 --> 00:00:28,900
|
||
导航、样式、页面、模板和样板。
|
||
|
||
9
|
||
00:00:28,900 --> 00:00:33,780
|
||
本教程旨在更深入地理解这些元素。
|
||
|
||
10
|
||
00:00:33,780 --> 00:00:37,060
|
||
我们从顶部的导航开始。
|
||
|
||
11
|
||
00:00:37,060 --> 00:00:40,428
|
||
在这里你可以快速查看和调整所有菜单,
|
||
|
||
12
|
||
00:00:40,428 --> 00:00:42,860
|
||
这是你管理菜单的命令中心。
|
||
|
||
13
|
||
00:00:42,860 --> 00:00:49,243
|
||
你可以直接进行简单编辑,比如重新排序,
|
||
|
||
14
|
||
00:00:49,243 --> 00:00:55,961
|
||
当你点击菜单项名称旁边的三个垂直圆点时,
|
||
|
||
15
|
||
00:00:55,961 --> 00:01:02,680
|
||
你可以根据需要重命名、复制和删除菜单项。
|
||
|
||
16
|
||
00:01:02,680 --> 00:01:04,891
|
||
如果在编辑模式下打开,
|
||
|
||
17
|
||
00:01:04,891 --> 00:01:07,906
|
||
你可以不受干扰地进行某些更改,
|
||
|
||
18
|
||
00:01:07,906 --> 00:01:10,720
|
||
并且更新将在你的网站上同步。
|
||
|
||
19
|
||
00:01:10,720 --> 00:01:17,486
|
||
当你点击加号图标时,可以添加新页面或其他菜单项。
|
||
|
||
20
|
||
00:01:17,486 --> 00:01:22,560
|
||
你会注意到导航区块在此区域被锁定。
|
||
|
||
21
|
||
00:01:22,560 --> 00:01:25,309
|
||
如果你想为导航菜单设置样式,
|
||
|
||
22
|
||
00:01:25,309 --> 00:01:29,040
|
||
你需要打开一个模板或它所属的模板部件。
|
||
|
||
23
|
||
00:01:29,040 --> 00:01:32,400
|
||
接下来,我们来谈谈样式。
|
||
|
||
24
|
||
00:01:32,400 --> 00:01:34,766
|
||
当你选择样式时,
|
||
|
||
25
|
||
00:01:34,766 --> 00:01:40,680
|
||
你将能够浏览主题附带的各种不同样式组合。
|
||
|
||
26
|
||
00:01:40,680 --> 00:01:45,659
|
||
当你点击编辑样式时,可以按年份浏览你的样式,
|
||
|
||
27
|
||
00:01:45,659 --> 00:01:49,280
|
||
然后更改网站的排版、颜色和布局。
|
||
|
||
28
|
||
00:01:49,280 --> 00:01:50,900
|
||
我们来看看它是如何工作的。
|
||
|
||
29
|
||
00:01:50,900 --> 00:01:58,400
|
||
当你点击版式时,你可以管理文本、链接、标题、说明文字和按钮的版式设置。
|
||
|
||
30
|
||
00:01:58,400 --> 00:02:04,260
|
||
一个很棒的新功能是,你现在还可以访问一个字体库。
|
||
|
||
31
|
||
00:02:04,260 --> 00:02:09,200
|
||
在字体下方,我们目前会看到由我们的主题已添加的字体。
|
||
|
||
32
|
||
00:02:09,200 --> 00:02:11,312
|
||
但当我们点击管理字体时,
|
||
|
||
33
|
||
00:02:11,312 --> 00:02:18,880
|
||
你将能够使用任何区块主题,在你的整个站点上安装、移除和启用本地及 Google 字体。
|
||
|
||
34
|
||
00:02:18,880 --> 00:02:25,760
|
||
当你点击安装字体时,你将能够在你的网站上安装任何 Google 字体。
|
||
|
||
35
|
||
00:02:25,760 --> 00:02:30,020
|
||
如果你想从你的电脑上传字体,请点击上传。
|
||
|
||
36
|
||
00:02:30,020 --> 00:02:35,280
|
||
请确保你有权使用你正在上传的任何字体。
|
||
|
||
37
|
||
00:02:35,280 --> 00:02:37,800
|
||
在版式下面,我们会看到颜色。
|
||
|
||
38
|
||
00:02:37,800 --> 00:02:43,800
|
||
在这里,你还可以更改站点上不同全局元素的颜色。
|
||
|
||
39
|
||
00:02:43,800 --> 00:02:46,155
|
||
当我们转到布局时,
|
||
|
||
40
|
||
00:02:46,155 --> 00:02:52,960
|
||
我们会注意到你甚至能控制诸如内边距和区块间距等元素。
|
||
|
||
41
|
||
00:02:52,960 --> 00:02:54,805
|
||
如果你再往下看,
|
||
|
||
42
|
||
00:02:54,805 --> 00:02:59,880
|
||
你还可以选择为整个站点自定义特定区块的外观。
|
||
|
||
43
|
||
00:02:59,880 --> 00:03:04,980
|
||
要查看如果你编辑这些区块它们会如何变化,请前往你站点的样式书。
|
||
|
||
44
|
||
00:03:04,980 --> 00:03:08,840
|
||
你会注意到顶部有一个小眼睛图标。
|
||
|
||
45
|
||
00:03:08,840 --> 00:03:14,920
|
||
样式书允许用户预览可以插入到你站点的每一个区块。
|
||
|
||
46
|
||
00:03:14,920 --> 00:03:21,372
|
||
它能让你快速预览全局样式将如何影响任何区块的显示,
|
||
|
||
47
|
||
00:03:21,372 --> 00:03:25,760
|
||
而无需用户将这些区块插入到模板中。
|
||
|
||
48
|
||
00:03:25,760 --> 00:03:31,080
|
||
同样重要的是,区块样式可以在样式书中进行调整。
|
||
|
||
49
|
||
00:03:31,080 --> 00:03:34,800
|
||
那么,我们以更新按钮区块为例。
|
||
|
||
50
|
||
00:03:34,800 --> 00:03:48,120
|
||
只需更改背景颜色,然后将字母大小写改为大写。
|
||
|
||
51
|
||
00:03:48,120 --> 00:03:51,933
|
||
如果你喜欢看到的效果,就可以直接点击保存。
|
||
|
||
52
|
||
00:03:51,933 --> 00:03:58,571
|
||
也请注意,如果你在样式书中更改了单个区块的样式,
|
||
|
||
53
|
||
00:03:58,571 --> 00:04:02,720
|
||
它将优先于你已设置的全局样式。
|
||
|
||
54
|
||
00:04:02,720 --> 00:04:05,720
|
||
既然说到这里,我们还需要谈谈样式修订版本。
|
||
|
||
55
|
||
00:04:05,720 --> 00:04:10,540
|
||
那么,我们继续点击样式书图标旁边的样式修订版本。
|
||
|
||
56
|
||
00:04:10,540 --> 00:04:14,920
|
||
当你处于样式书中或正在编辑模板时,样式修订版本就会打开。
|
||
|
||
57
|
||
00:04:14,920 --> 00:04:20,241
|
||
样式修订版本功能提供了一种可视化方式,让你浏览样式随时间的变化,
|
||
|
||
58
|
||
00:04:20,241 --> 00:04:24,565
|
||
如果你找到了更喜欢的样式,可以轻松恢复到之前的阶段,
|
||
|
||
59
|
||
00:04:24,565 --> 00:04:26,560
|
||
或者想回退到之前的版本。
|
||
|
||
60
|
||
00:04:26,560 --> 00:04:31,620
|
||
你只需选择版本,然后点击应用即可。
|
||
|
||
61
|
||
00:04:31,620 --> 00:04:35,620
|
||
在这个例子中,我正在编辑一个模板,并将遵循同样的流程。
|
||
|
||
62
|
||
00:04:35,620 --> 00:04:46,660
|
||
我将打开样式修订版本,选择一个之前的样式,然后点击应用以恢复。
|
||
|
||
63
|
||
00:04:46,660 --> 00:04:51,477
|
||
当你点击样式旁边的三个垂直圆点时,
|
||
|
||
64
|
||
00:04:51,477 --> 00:04:56,860
|
||
你将能够重置样式以及添加额外的 CSS。
|
||
|
||
65
|
||
00:04:56,860 --> 00:05:02,100
|
||
有了这些样式,我们就可以前往页面,创建并发布页面了。
|
||
|
||
66
|
||
00:05:02,100 --> 00:05:07,300
|
||
要添加新页面,请点击页面旁边的加号图标并创建草稿。
|
||
|
||
67
|
||
00:05:07,300 --> 00:05:09,676
|
||
但你当然也可以在仪表盘
|
||
|
||
68
|
||
00:05:09,676 --> 00:05:12,700
|
||
或 WP 管理后台中创建新页面。
|
||
|
||
69
|
||
00:05:12,700 --> 00:05:17,900
|
||
接下来,让我们打开一个现有页面,我的关于页面。
|
||
|
||
70
|
||
00:05:17,900 --> 00:05:22,980
|
||
当你打开一个页面时,重要的是要记得将内容添加到内容区块。
|
||
|
||
71
|
||
00:05:22,980 --> 00:05:28,020
|
||
换句话说,内容区块是你所有内容的房子或容器。
|
||
|
||
72
|
||
00:05:28,020 --> 00:05:31,505
|
||
第二件要记住的事是,你无法在编辑页面时
|
||
|
||
73
|
||
00:05:31,505 --> 00:05:35,540
|
||
编辑页面时,这都属于管理模板的一部分。
|
||
|
||
74
|
||
00:05:35,540 --> 00:05:38,527
|
||
如果你点击页眉,你会看到一条信息
|
||
|
||
75
|
||
00:05:38,527 --> 00:05:41,140
|
||
提示你编辑模板来编辑此区块。
|
||
|
||
76
|
||
00:05:41,140 --> 00:05:44,653
|
||
如果你想修改已分配给此页面的模板,
|
||
|
||
77
|
||
00:05:44,653 --> 00:05:46,720
|
||
你可以点击编辑模板。
|
||
|
||
78
|
||
00:05:46,720 --> 00:05:50,576
|
||
在这个例子中,这会带你进入你的页面模板,
|
||
|
||
79
|
||
00:05:50,576 --> 00:05:53,660
|
||
在这里你可以修改你的页眉和页脚。
|
||
|
||
80
|
||
00:05:53,660 --> 00:05:57,060
|
||
你将无法向模板添加内容。
|
||
|
||
81
|
||
00:05:57,060 --> 00:06:00,340
|
||
内容当然是被添加到文章和页面中。
|
||
|
||
82
|
||
00:06:00,340 --> 00:06:04,600
|
||
在这种情况下,内容区块仅仅是一个占位符。
|
||
|
||
83
|
||
00:06:04,600 --> 00:06:07,940
|
||
这就引出了我们的下一个话题,即模板。
|
||
|
||
84
|
||
00:06:07,940 --> 00:06:11,580
|
||
模板为你的内容如何显示提供了结构。
|
||
|
||
85
|
||
00:06:11,580 --> 00:06:14,968
|
||
当你选择模板时,你会注意到一系列
|
||
|
||
86
|
||
00:06:14,968 --> 00:06:17,720
|
||
随主题附带的、内置的模板。
|
||
|
||
87
|
||
00:06:17,720 --> 00:06:21,760
|
||
例如,用于显示单个页面的页面模板,
|
||
|
||
88
|
||
00:06:21,760 --> 00:06:25,087
|
||
作为完整后台模板的索引模板,
|
||
|
||
89
|
||
00:06:25,087 --> 00:06:29,840
|
||
或是用于显示单篇文章布局的单篇文章模板。
|
||
|
||
90
|
||
00:06:29,840 --> 00:06:33,760
|
||
而在最底部,我们将看到任何自定义模板。
|
||
|
||
91
|
||
00:06:33,760 --> 00:06:36,673
|
||
当你点击模板旁边的加号图标时,
|
||
|
||
92
|
||
00:06:36,673 --> 00:06:38,808
|
||
你可以添加各种新模板,
|
||
|
||
93
|
||
00:06:38,808 --> 00:06:43,080
|
||
甚至是可以应用于任何文章或页面的自定义模板。
|
||
|
||
94
|
||
00:06:43,080 --> 00:06:47,320
|
||
让我们打开页面模板,以便更好地理解模板的工作原理。
|
||
|
||
95
|
||
00:06:47,320 --> 00:06:49,400
|
||
模板提供结构。
|
||
|
||
96
|
||
00:06:49,400 --> 00:06:54,440
|
||
模板通常包含一个页眉模板部分和一个页脚模板部分。
|
||
|
||
97
|
||
00:06:54,440 --> 00:07:00,800
|
||
而文章内容区块会拉取指派给该模板的页面或文章的内容。
|
||
|
||
98
|
||
00:07:00,800 --> 00:07:05,765
|
||
因此,模板仅用于修改页面的布局或设计,
|
||
|
||
99
|
||
00:07:05,765 --> 00:07:08,640
|
||
即页眉、页脚甚至边栏。
|
||
|
||
100
|
||
00:07:08,640 --> 00:07:14,560
|
||
因此,站点编辑器明确区分了编辑模板和编辑页面。
|
||
|
||
101
|
||
00:07:14,560 --> 00:07:18,440
|
||
你可以在模板内修改你的页眉和页脚。
|
||
|
||
102
|
||
00:07:18,440 --> 00:07:24,480
|
||
你还可以选择点击三个垂直点,然后选择“替换页眉”。
|
||
|
||
103
|
||
00:07:24,480 --> 00:07:28,960
|
||
然后,你可以用现有的某个页眉模板部分,
|
||
|
||
104
|
||
00:07:28,960 --> 00:07:33,440
|
||
或主题自带的页眉区块样板来替换当前的页眉。
|
||
|
||
105
|
||
00:07:33,440 --> 00:07:37,120
|
||
另一个选项是选择你的页眉,然后点击“编辑”。
|
||
|
||
106
|
||
00:07:37,120 --> 00:07:43,820
|
||
这将允许你在模板编辑模式下修改页眉或页脚,不受其他干扰。
|
||
|
||
107
|
||
00:07:43,820 --> 00:07:51,838
|
||
要为页面或文章分配新模板,请打开相关内容,本例中是我的“关于”页面,
|
||
|
||
108
|
||
00:07:51,838 --> 00:07:58,441
|
||
然后在右侧的边栏设置中,找到“模板”旁边,点击模板名称,
|
||
|
||
109
|
||
00:07:58,441 --> 00:08:06,223
|
||
选择“交换模板”,然后你就可以选择一个自定义模板分配给页面或文章。
|
||
|
||
110
|
||
00:08:06,223 --> 00:08:14,150
|
||
同样值得一提的是,当你点击“管理所有模板”,然后选择“批量编辑”时,
|
||
|
||
111
|
||
00:08:14,150 --> 00:08:21,020
|
||
你将能够通过表格视图或网格视图来浏览和筛选你的模板。
|
||
|
||
112
|
||
00:08:21,020 --> 00:08:25,660
|
||
而当你再次选择“批量编辑”时,会有更多的筛选选项。
|
||
|
||
113
|
||
00:08:25,660 --> 00:08:32,620
|
||
请注意,你可以用完全相同的方式来浏览和筛选页面与模板部分。
|
||
|
||
114
|
||
00:08:32,620 --> 00:08:37,420
|
||
最后,我们来谈谈样板。
|
||
|
||
115
|
||
00:08:37,420 --> 00:08:41,900
|
||
在顶部,你将能够查看所有可用的样板。
|
||
|
||
116
|
||
00:08:41,900 --> 00:08:48,820
|
||
当你选择“我的样板”时,你可以创建并管理你自己的自定义同步与非同步样板。
|
||
|
||
117
|
||
00:08:48,820 --> 00:08:53,322
|
||
在“我的样板”下方,我们可以查看所有自定义样板,
|
||
|
||
118
|
||
00:08:53,322 --> 00:08:57,620
|
||
以及我们主题附带的、按相关分类排列的样板。
|
||
|
||
119
|
||
00:08:57,620 --> 00:09:04,900
|
||
而在“模板部分”下方,我们也可以创建并管理页眉、页脚和通用模板部分。
|
||
|
||
120
|
||
00:09:04,900 --> 00:09:07,700
|
||
模板部分本质上就是样板。
|
||
|
||
121
|
||
00:09:07,700 --> 00:09:12,900
|
||
它们是同步的可复用组件,可以在您的整个站点中使用。
|
||
|
||
122
|
||
00:09:12,900 --> 00:09:15,220
|
||
让我们从我的样板开始。
|
||
|
||
123
|
||
00:09:15,220 --> 00:09:22,620
|
||
要创建您自己的自定义样板,请点击样板旁边的插入器,然后选择创建样板。
|
||
|
||
124
|
||
00:09:22,620 --> 00:09:29,612
|
||
为其命名后,您可以选择将其添加到相关分类,
|
||
|
||
125
|
||
00:09:29,612 --> 00:09:33,940
|
||
然后决定是否同步您的样板。
|
||
|
||
126
|
||
00:09:33,940 --> 00:09:37,268
|
||
同步样板将在您的整个站点中同步,
|
||
|
||
127
|
||
00:09:37,268 --> 00:09:44,340
|
||
这意味着如果您在一个地方修改了您的样板,它在任何使用的地方都会更新。
|
||
|
||
128
|
||
00:09:44,340 --> 00:09:50,860
|
||
如果您更喜欢非同步样板,也可以关闭这个选项。
|
||
|
||
129
|
||
00:09:50,860 --> 00:09:56,700
|
||
非同步样板就是普通的区块样板,可以独立编辑。
|
||
|
||
130
|
||
00:09:56,700 --> 00:09:59,514
|
||
当您返回到自定义样板区域时,
|
||
|
||
131
|
||
00:09:59,514 --> 00:10:04,740
|
||
您会注意到同步样板有一个紫色图标,而非同步样板没有。
|
||
|
||
132
|
||
00:10:04,740 --> 00:10:10,105
|
||
接下来,您会注意到主题自带的样板是锁定的,
|
||
|
||
133
|
||
00:10:10,105 --> 00:10:12,660
|
||
因此你无法编辑它们。
|
||
|
||
134
|
||
00:10:12,660 --> 00:10:17,481
|
||
但是,当你点击样板下方的三个垂直圆点时,
|
||
|
||
135
|
||
00:10:17,481 --> 00:10:21,820
|
||
你就可以将其复制到“我的样板”区域。
|
||
|
||
136
|
||
00:10:21,820 --> 00:10:28,380
|
||
在底部,我们也可以创建和管理页眉、页脚和通用模板部分。
|
||
|
||
137
|
||
00:10:28,380 --> 00:10:30,100
|
||
这里你有两个选择。
|
||
|
||
138
|
||
00:10:30,100 --> 00:10:36,580
|
||
你可以创建自定义页眉和页脚,或者自定义主题自带的模板部分样板。
|
||
|
||
139
|
||
00:10:36,580 --> 00:10:42,250
|
||
要创建你自己的模板部分,请点击顶部样板旁边的加号图标,
|
||
|
||
140
|
||
00:10:42,250 --> 00:10:44,980
|
||
然后选择“创建模板部分”。
|
||
|
||
141
|
||
00:10:44,980 --> 00:10:50,840
|
||
当你添加一个新的模板部分时,可以在通用、页眉和页脚模板部分之间选择。
|
||
|
||
142
|
||
00:10:50,840 --> 00:10:58,140
|
||
通用模板部分不绑定到任何特定区域,记得给它们起一个描述性的名称。
|
||
|
||
143
|
||
00:10:58,140 --> 00:11:02,144
|
||
当你从“年”中打开一个模板部分时,
|
||
|
||
144
|
||
00:11:02,144 --> 00:11:08,740
|
||
你就能在模板编辑模式下不受干扰地修改和编辑你的模板部分。
|
||
|
||
145
|
||
00:11:08,740 --> 00:11:15,333
|
||
或者,你可以打开相关模板,在这个例子中是我的自定义模板,
|
||
|
||
146
|
||
00:11:15,333 --> 00:11:21,220
|
||
然后你就可以在模板内部修改你的页眉或页脚模板部分。
|
||
|
||
147
|
||
00:11:21,220 --> 00:11:27,967
|
||
正如之前所示,你可以轻松地将你的一个页眉或页脚
|
||
|
||
148
|
||
00:11:27,967 --> 00:11:32,660
|
||
替换为库中的样板或现有模板部分。
|
||
|
||
149
|
||
00:11:32,660 --> 00:11:37,290
|
||
最后,我还想强调一个非常有用的功能,叫做命令面板,
|
||
|
||
150
|
||
00:11:37,290 --> 00:11:42,660
|
||
它将为你节省大量时间,并帮助你在站点编辑器中更高效地操作。
|
||
|
||
151
|
||
00:11:42,660 --> 00:11:49,020
|
||
命令面板让你能在站点编辑器中快速完成任务并进行导航。
|
||
|
||
152
|
||
00:11:49,020 --> 00:11:54,952
|
||
例如,你可以输入 new 来创建页面或模板,
|
||
|
||
153
|
||
00:11:54,952 --> 00:12:01,963
|
||
或者直接输入你想去的区域名称,例如 pattern,
|
||
|
||
154
|
||
00:12:01,963 --> 00:12:04,660
|
||
来管理我所有的样板。
|
||
|
||
155
|
||
00:12:04,660 --> 00:12:09,024
|
||
你可以通过快捷键 command K(Mac)来访问命令面板,
|
||
|
||
156
|
||
00:12:09,024 --> 00:12:11,980
|
||
或 control K(Windows)。
|
||
|
||
157
|
||
00:12:11,980 --> 00:12:20,780
|
||
你也可以在站点视图边栏中点击搜索图标找到它,
|
||
|
||
158
|
||
00:12:20,780 --> 00:12:26,380
|
||
或者你也可以直接点击标题栏。
|
||
|
||
159
|
||
00:12:26,380 --> 00:12:30,980
|
||
以上就是使用站点编辑器所能实现功能的简要概述。
|