我有时会收到一些关于如何定制博客的邮件,所以我觉得应该找个时间把这些信息发布成一篇综合性的文章,总结所有内容,并附上一些有用的链接。这篇文章并非旨在取代邮件,所以如果你有任何问题,尽管联系我——我只是不想因为要给我发信息而锁住它 🙂 而且我会尽量让这篇文章对新手友好!
基础知识
- 当你看到一个很棒的博客时,你可以右键点击该网站,点击“查看页面源代码”(或浏览器中的等效按钮),然后查看其代码。Bearblog 的自定义 CSS 部分从
<style>
开始。 - 如果您对网站的某个特定部分感兴趣,请右键单击该部分,然后点击“检查”。这将打开一个视图,显示该部分背后的代码。
- 如果您想用 CSS 定位网站的特定部分,但不知道它的名称,检查并复制 CSS 路径会有所帮助。它并不总是完全准确地反映您想要的操作(尤其是如果它添加了第 n 个子元素;您很可能可以更好地定位它),但它至少可以为您提供一些有用的信息。
- MDN是 CSS 的良好资源;我喜欢您可以点击的实时示例。
bearblog 特定
- 对于 Bearblog 特定的样式,请务必查看样式文档
- mgx 的bear.css.observer可以供你使用。为了熟悉 CSS 的工作原理,可以尝试更改一些值,例如颜色和大小,看看主题会如何反应;例如将红色改为蓝色,将 200px 增加到 210px 等等。这也能让你理解一些常用的术语,例如颜色、宽度、字体大小、边距、填充、边框半径等等(在我看来,这些对于初学者自定义主题至关重要)。
- 很多主题都可以与Bearming 插件兼容(只需进行一些调整)。我没有使用Bearming 主题,但我的设计中也用到了 Bearming 插件。我的很多页面都使用了时间线插件,“其他人的评价”部分使用了用户评价插件。
- 请务必记住,您可以设置帖子属性,并且可以保存帖子模板(通过帖子编辑器中的“编辑模板”按钮),这样当您点击“新帖子”时,所有内容都会预先填充。您可以在那里设置元数据,例如标签、描述、图片(这些都会在帖子发布到社交媒体、Discord 等平台时显示的预览中显示)等等。
- 如果您想自动显示一些信息,例如基于标签的帖子列表,或者博客或帖子的创建时间、您上次活动的时间等等,我建议您查看嵌入自定义帖子列表和Neat Bear 功能的文档。自定义帖子列表是我的主页和按年份划分的“所有条目”页面的工作方式,而插入博客属性则是它如何在我上次发帖时自动更新并在主页上显示此博客的创建时间。
- 如果您只想更改博客中某一页面的外观,您可以通过文章属性设置类名(更多详情请见此处),这样您就可以在常规主题 CSS 中专门针对该页面进行更改;或者像我一样,采用一种偷懒的方法:将自定义 CSS 写入文章本身,以
<style>
开头,以</style>
结尾。我的Filou和Benji页面就是这样运作的;它们将导航栏和页脚等许多内容设置为 display: none,并更改背景颜色和宽度等值。 - 请记住,您不仅可以自定义博客,还可以自定义仪表盘。我一直使用这段代码来显示我总共有多少篇帖子(如果您好奇的话,现在有超过 340 篇)。
其他列表
- 这是 folkmoss 的列表,
- 这份由 Sylvia 提供的资源列表提供了更多有用的调整。
我的东西
- 这是我的博客设计代码。应该有99%是最新的,因为之后我没怎么修改过。
- 这是我的闪烁光标标题代码。这是一个奇怪的解决方案,你可能需要换一种方式。
如果我能想到其他任何事情,我会更新它:)
通过电子邮件回复
已发布于