WordPress课程2025-10

本期视频将带你完成 WordPress 网站的全局设置,包括字体、标题样式、配色方案、按钮样式、网站内容宽度、回到顶部按钮等内容。通过这些设置,你可以统一网站的视觉风格,为后续页面设计打下坚实基础。

全局设置

你每选择一个对应的字体,它会在右边实时同步调整。

如果想要更丰富的预览效果,可以直接浏览 Google Fonts 网站。

我们目前的字体库只有一小部分是系统字体,大多数是来自谷歌字体。

我个人文本字体常用的是 Roboto,标题字体常用的是 Alata。

你可以在 Google Fonts 上预览,比如 Roboto 是非常适合作为文本字体的,Alata 则很适合作为标题。

Body Font 和 Heading Font 设置好后,接下来设置 H1 到 H6 的标题字号。

点击 H1,Font Family 保持 inherit 即继承上方设定。建议整个网站不超过三种字体。

设置 H1 字号为 46,粗细为 Bold。

H2 字号为 36,粗细为 Bold。

H3 字号默认 24,不改,粗细为 Bold。

H4 字号 20,粗细设置为 Semi Bold。

H5 字号 18,粗细为 Semi Bold。

H6 字号 16,粗细为 Semi Bold。

设置好后点击 Publish。右边内容会实时预览字体效果。

接下来设置 Colors。

可以预设常用颜色,之后样式设计时可以直接使用,无需重复输入色号。

Theme Colors 部分:

  • Action:指选中某项时的颜色,默认蓝色,可自定义。

  • Links:设置链接文字的 normal 与 hover 两种状态的颜色。

  • Headings:设置标题字体颜色,默认是较淡的黑色。

  • Body:正文颜色,默认稍深的灰色。

  • Borders:边框颜色。

  • Site Background:网站整体背景色,默认浅灰色。建议设为白色更清爽。

  • Content Background:容器内容背景色,默认白色。

Colors 设置好后点击 Publish。

返回设置 Container。

Container Width 默认是 1200,建议保留不改,基本是网站的标准宽度。

按钮样式(Buttons)设置:

  • 有六种样式预设,未来网站中所有按钮都会继承。

  • 可以设置文本颜色、背景颜色、边框颜色,分别有 Normal 与 Hover 两种状态。

  • Padding:控制按钮内文字与边缘的距离,默认上下 15、左右 30,适中。

  • Border Width:边框宽度,一般默认即可。

  • Border Radius:控制按钮圆角大小。

  • Secondary 可以设置另一种备用按钮样式。

我个人常用默认样式,个别页面需要特别样式时再单独调整。

Scroll to Top:开启后网页右下角会出现“回到顶部”按钮。

  • 默认开启。

  • 可设置显示位置(桌面端、移动端或都显示)。

  • 图标大小与位置也可自定义。

后面的两个设置暂时用不到,可以忽略。

至此,Global Settings 全局设置全部完成,其他高级设置可根据需要调整。