WordPress入门【四、主题】

Sterope_

已于 2022-09-04 01:13:41 修改

阅读量388

点赞数

分类专栏： WordPress HTML/css 文章标签：前端 html javascript

于 2022-09-04 01:07:25 首次发布

本文链接：https://blog.csdn.net/Ssterope/article/details/126683887

版权

WordPress 同时被 2 个专栏收录

5 篇文章 4 订阅

订阅专栏

HTML/css

1 篇文章 0 订阅

订阅专栏

WordPress支持用户自由选择喜爱的主题和插件。在这一篇里，我们一起来看看如何管理主题和吧~

主题

众所周知，WordPress在自定义上给了用户非常大的选择自由，有成千上万的主题供我们使用。
首先，我们要了解主题的概念。

1. 主题是什么？

在我看来，主题为不擅长设计和代码编写的用户提供了打开即用的网站模板，提供一些HTML模板和CSS样式，让用户不需要做任何多余的编码工作，也不需要考虑每个内容应该放在网页页面的哪一个位置展示，只需要找一个你喜欢的，跟你想象中的网站相似的主题，编辑你想要发布的内容，就能够轻松地拥有一个看起来符合期待的网站。

一个不大贴切但又说得通的比喻是：主题就好像qq空间的皮肤，当你切换一个皮肤，你的空间会展示出完全不同的效果，甚至会拥有不同的栏目。主题也正是如此，除了外观上的不同以外，不同的主题还会提供给你一些额外的功能，感兴趣的话可以到官网的主题列表，查看不同的主题究竟为你提供了哪些神奇的功能。

2.怎么管理主题？

我们首先要登陆WordPress的管理后台，正如上一篇博客提到的那样，如果感觉有些忘记了，可以随时回头去确认步骤哦。
登录后台到“仪表盘”界面【即WordPress后台管理页面】后，我们可以点击左侧栏的“主题”选项，或将鼠标在该项悬停，会看到如下的子菜单选项。
主题show here
点击主题，可以对当前的所有主题进行管理，以下是我安装的主题列表

在这里插入图片描述

添加新的主题

来看看怎么安装一个新的主题吧！

在这里插入图片描述
无论是点击“安装主题”还是“+”号，都指向相同的功能- 添加主题

在这里插入图片描述
在这里，你可以通过搜索框使用关键字搜索你心仪的主题，也可以在热门/最新/收藏里寻找你要找的目标，更可以通过“特性筛选”来选择你的搜索范围，一旦找到你喜欢的主题，将鼠标移动到该主题上

会出现“安装”和“预览”选项，无论何时，安装之前预览看看效果都是不错的选择，一旦你确定就是它了。就点击“安装”把这个主题收入囊中吧！
安装成功后，你会在该主题上方看到“已安装”字样，你可以选择现在就点击“启用”开始使用它，也可以稍后在已安装的主题页面进行操作。

在这里插入图片描述
同时，你也可以在添加主题页左上角看到“上传主题”，点击后，你可以手动上传从网络上下载的其他主题。
当你拥有一个主题压缩包时，你也可以将它解压并复制粘贴到网站根目录下的 wp-content/themes 文件夹中

在这里插入图片描述
然后刷新仪表盘，就可以看到该主题出现在你的已安装主题列表啦。

查看主题详情

当前使用的主题会出现在列表的左上角第一项。当鼠标悬停时，会出现“主题详情”

删除不需要的主题

点击主题详情，你将看到该主题的相关说明内容【当点开的不是当前正在使用的主题时，右下角会出现一个红色的删除按钮，点击即可删除这个你不需要的主题，如下图】
在这里插入图片描述
同时，你也可以本地的WordPress网站根目录下的 wp-content/themes 文件夹中找到你想删除的主题名，手动将该文件夹删除【当然，不推荐新手小白乱删文件哦，还是按WP给的默认方式去管理它吧！~】
删除主题

切换不同的主题

当然，别忘了你还可以点击“启用”来激活这个主题，看看它和你之前的主题有什么不同哦。

了解如何查看主题，启用主题和删除不需要的主题后，

3.自定义一个最简单的主题

如果你能写一点点代码，我绝对推荐你自己创建一个最简单的主题。
只需要wp-content/themes文件夹新建一个文件夹，将文件夹命名为你独特的主题名，比如 hellowptheme 【前提是没有同名的其他主题文件夹存在哦】
一个最最简单的主题文件夹只需要包含两个文件，WordPress就能进行识别。

最简陋的主题文件
index.php 和 style.css 是一个主题必不可少的两部分。
但并不是创建两个空的文件就可以了哦，为了让WordPress识别出这确实是一个主题，我们需要在 style.css 文件里写一些必要的代码

/*
Theme Name: Hello WP Theme
*/

只有上面的代码是必不可少的，你会发现刷新一下仪表盘，在已安装主题列表已经出现了刚刚创建的这个主题啦！
在这里插入图片描述
但是它看起来没有缩略图，点开详情看看，有什么内容呢？

当然什么也没有！因为我们没有为它准备任何内容。

可以通过在style.css的头部添加一些内容，来丰富我们主题的详情页面。
以下是一个相对简洁但还算完整的 style.css 的实例。我们在里面加入了许多详情内容。

/*
Theme Name: Hello WP Theme
Text Domain: hellowptheme
Version: 1.0
Description: 这是一段关于主题的描述哦，你想写些什么来向大家推销你的主题呢？
Tags: 亲手创建一个最简单的主题, nothing-special, 在这里放一些你想添加的标签吧
Author: Sterope_
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
*/

/* 当然啦 在这里你也可以不要写任何样式，但我建议你写一写，这样以后你可以看到它在网站主页是怎么展示的*/
body {
    background: #21759b;
    }

保存再刷新来看看吧~
在这里插入图片描述
现在我们可以看到主题的版本/ 作者/ 描述和标签啦！如果感兴趣的话，可以 点击这里 查看更多“如何开始创建一个主题”的相关信息哦。
现在我们的主题已经可以被识别了，但是我还是希望你来编辑一下index.php这个文件，以便我们可以在打开网站的时候，不会一片空白，毫无反应。
我会在index.php里写一点点最简单的内容

<?php 
    echo "hellowptheme";
?>

当然，如果你愿意的话，即使就写123，也是可以的哦。
保存以后，让我们激活主题，鼠标悬停到左上角的站点名- 点击“查看站点”，这样我们就可以看到我们的网站究竟会如何显示了。
在这里插入图片描述
现在你可以看到我在index.php写的代码开始工作了

为什么这里看不到之前设置的body的背景色呢？以后我再告诉你吧~
如果不巧你是个急性子，可以先去WordPress官网了解一下开发课程，相信聪明的你很快就会知道原因啦！

最后，我们的主题似乎没有一个合适的缩略图，虽然是最简主题，但是我们可以添加一个尺寸为1200*900的网站首页截图，命名为screenshot.png 【官方推荐你使用png图片，但经过我的实践，不管后缀是png还是jpg都行得通哦】

在这里插入图片描述

重新回到仪表盘，进入主题项，看，我们的主题也有一个图片了！不需要你编写更多的代码，只要在合适的位置放上对应文件名的文件，WordPress会为你完成剩下的所有事儿~

在这里插入图片描述

主题就介绍到这啦~如果你的求知欲不止于此，WordPress官网欢迎你去探索更多内容！！！
下一篇我们会介绍WordPress的插件！

Sterope_

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
1
评论
WordPress入门【四、主题】

如果你能写一点点代码，我绝对推荐你自己创建一个最简单的主题。index.php和style.css是一个主题必不可少的两部分。但并不是创建两个空的文件就可以了哦，为了让WordPress识别出这确实是一个主题，我们需要在style.css文件里写一些必要的代码/**/
复制链接

扫一扫