如何在 Notion 中使用动态 Icon 与壁纸 ？

印象里听过这样一句话，Notion 让我们找回了当年 DIY QQ 空间的乐趣，已经寻不到说这句话的正主，但是仔细想想，还是挺有意思。

概要

本篇内容偏介绍类，无需理论基础，但是需要懂得如何修改文本，以达到自己想要的效果。

• 自定义日历 Icon 与 Bing 壁纸；
• 修改自定义日历 Icon 时间，让日期不变；
• 修改自定义日历 Icon 日期颜色，突出显示。

看看效果？

Notion icon 嵌入

Notion 的 Icon 是支持嵌入 image 格式的内容，兼容格式有：PNG、JPG、GIF、SVG、BASE64 字符。

如果你想要你的 Notion icon 或者 Cover 动起了，那么可以试试内嵌一个 GIF 图片。比如弄一个春意黯然、散发花香的动图。

如何嵌入 Icon

找到 Page 上的 Add icon 按钮，点击后选择你想要的 icon 即可。注意 Notion Page 与 Notion Database 显示方式是不一样的，Notion Database 在左边显示，对比 Page 比较小。

动图演示

动态日历 Icon 的起因

起因是 @Jack 在 Notion 中文社区的 TG 群里发了一个链接：

https://shkspr.mobi/svg/calendar.svg

当你浏览器访问这个链接时，会显示本月、当日与本周，很是神奇。但是试着把这个链接嵌入到 Notion 后，显示的是原始的图片，并没有获取到当日的图。带着好奇心我试着看了一眼这个日历 icon 的源码。

原作者是在 SVG 图片里嵌入了 JavaScript 脚本， Notion 为了安全原因，比如避免 XSS，禁用了执行 JavaScript 脚本，所以显示的就是默认的文本。

我昨晚试着做出了第一个版本，但是只能获取到当天的 时间，如果想显示昨天，前天或者说是任意一天，做不到。

❤️这里要感谢一下 AFuture，在他的提醒下，可以通过自定义链接参数，来实现上述的效果。并且 AFuture 最后还实现了一个很不错的版本，也就是现在采用的版本。

嵌入自动获取时间的日历 Icon

嵌入每日变化的日期

https://linmi.cc/calendar/

复制上面的链接，Add icon，找到 Url，粘贴进去确定即可。

嵌入固定日期

https://linmi.cc/calendar/index.php?date=2020-03-09

date=2020-03-09 后面的日期就是可以修改的日期，比如生成五月十号的日历 Icon，那么就可以这么写：2020-05-10，放在?date=后面，就得到了

https://linmi.cc/calendar/index.php?date=2020-05-10

可改进的点

考虑到目前这个链接获取的是中国的时间，那么对于外国就不那么好用了，所以后期会添加一个时区选项，链接生成是根据时区来。

嵌入动态壁纸背景

固定的壁纸背景很单调， 不如尝试试试每天定时换一张，也能顺便换换自己的好心情。

Notion 中如何嵌入背景

Notion 嵌入背景与嵌入 Iocn 方式一样。我们找到 Add cover，点击后即可自定义背景。

嵌入动态壁纸

这里我就不做自己搭建，选用了第三方的服务，有兴趣折腾的同学，可以试着自己自定义：https://github.com/xCss/bing、http://bing.creepersan.com/document。

http://www.neweb.top/bing.php

调整背景位置

如果觉得背景看起来不是很舒服，可以试着调整一下图片的位置。

总结

其实这类内嵌的壁纸，还有很大的想象空间，比如图片可以定时显示当天播放的番剧、汇率、天气、穿衣情况。

更有可能，试着嵌入其他软件的任务进来？

参考链接

• This SVG always shows today’s date

例行

欢迎加入 Notion 中文社区社群：linmi.cc/n