首页 问答 正文

如何为WordPress主题添加自定义CSS?

注册会员 / 悠然自学 / 2023-06-12/ 浏览 62 次

在WordPress主题中添加自定义CSS有以下几种方法:

  1. 主题自定义选项或主题自带的自定义CSS选项:
    • 打开WordPress后台,进入“外观” -> “自定义”。
    • 在自定义选项中,通常会提供一个“自定义CSS”或类似的选项。
    • 在该选项中,可以直接添加自定义CSS代码。

示例代码:

body {
  background-color: #f1f1f1;
  font-family: Arial, sans-serif;
} 
  1. 使用子主题:
    • 在WordPress的主题文件夹中创建一个新文件夹,命名为你喜欢的子主题名称。
    • 在子主题文件夹中创建一个名为style.css的文件,并添加你的自定义CSS代码。
    • style.css文件的开头,添加以下注释,指定该主题是父主题的子主题:
      /*
      Theme Name: [子主题名称]
      Template: [父主题名称]
      */ 
    • 在WordPress后台切换到子主题。

示例代码:

/*
Theme Name: My Custom Theme
Template: Twenty Twenty-One
*/

body {
  background-color: #f1f1f1;
  font-family: Arial, sans-serif;
} 
  1. 使用插件:
    • 在WordPress后台,进入“插件” -> “添加新插件”。
    • 搜索并安装一个自定义CSS插件,如"Simple Custom CSS and JS"。
    • 启用插件后,进入“外观” -> “自定义 CSS & JS”页面。
    • 在“CSS”选项卡下,添加你的自定义CSS代码。

示例代码:

body {
  background-color: #f1f1f1;
  font-family: Arial, sans-serif;
} 

以上是为WordPress主题添加自定义CSS的几种方法,你可以根据需要选择其中一种来添加自定义CSS样式。

大家谈论
    我的见解