给 Typecho 博客添加文章页相册功能
使用场景
写文章时(比如出行游记),如果在内容区一张一张的插入很多很多图片,会显得文章比较冗长,尤其是使用竖版构图的图片,往往高度霸屏。此时,若能以相册的方式,在当前页面集中呈现这些照片,会大大增强浏览体验。
主要效果
1. 相册以九宫格(可调数量)的形式呈现在文章末尾。
2. 九宫格的图片以随机形式呈现,刷新页面可见效果。
3. 点击图片后以灯箱的形式呈现,并能添加图片描述。
4. 点击最后方块可以链接至相关内容,如文章或相册。
实现方式
方式一:在文章 A 的文末调用文章 A(或文章 B)的附件中所有图片作为相册展示,并链接至相关内容(如文章 B)。查看演示(当前页文末九宫格图集),刷新页面可见随机图片效果。
方式二:在文章 A 的文末调用通过 Snapic Page(Typecho 独立页相册模板)创建的相册 A,并链接至相册 A。查看演示(演示页文末九宫格图集)。
如何实现
电邮
关于竖屏中文排版heti(https://sivan.****.io/heti/)的实现很完整,效果也很棒,也许可以参考一下。
我是参考了掘金的一篇文章 https://****.cn/post/6966449320744714277
heti 的日期也没立起来嘛
最好是把日期转换为中文格式。数字垂直排列本就很不好阅读
是的,有空研究下php中文格式日期。
再加上:
text-orientation: upright; text-transform: uppercase;
我是说.single-meta类里面。
确实,中英文显示规整多了,赞!
哈哈,发现竖排坑好深,单单日期就多用了十多行代码,还有中英文混排、字母大小写、标点乱码……好多问题。
哈哈是不是给你增加了不少闲暇折腾代码的乐趣
确实是学到不少技巧。
提个意见,标题既然是复古的竖版,日期为什么又是横版,抬头空了一大片好难看呢。
以及干脆正文也竖版会不会b格更高一些。
之前的日期也是竖版的,但是发觉竖排的数字不能一眼看清,就弄了横版的日期。抬头的空白嘛,主要是文章首图本身也是白底,所以了……如果是照片的话会感觉充实些
可以把数字改成中文的,比如
五
月
廿
二
日
然后具体罗马日2022/5/2用title标签hover浮上面。
这个点子可以试下,不过得先把php的日期格式转成中文。
形式不错