中午收到一封QQ邮箱的退信推送，也没管，不一会就连续收到退信，点进去看了一下好像内容是文章订阅，应该是文章底部的订阅被人一直刷了，起初也没在意，但是QQ邮箱一直给我推送就很烦，干脆就给直接禁用了。结果这个傻逼不知道咋想的，又tm开始在我留言板一直留言，看这留言貌似是给我挂马来了，就很无语=_=啊，你挂之前能不能先调查一下，我tm毛流量没有，你挂了有啥用啊？这会给留言板加了给邮箱验证码，博客评论也接入了TSpamReview - Typecho 评论审核插件本来是啥也没有的，就压根懒得弄这些，本来就是个人博客，交交朋友啥的，怎么总是有这种蛆虫😓
封面仅供参考 哈哈哈Smart Gallery 智能相册专为 Typecho 1.3.0 设计的现代化相册插件，支持本地图片管理、WebP 压缩与私密相册功能。演示与反馈官网演示：https://www.luohuayu.cn/photo.htmlBUG 反馈：3554171776@qq.com后台演示 /* PictureOrder Gallery Styles */ #picture-order-6a75232b58a37 { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; width: 100%; margin: 0; padding: 0; line-height: 0; font-size: 0; } #picture-order-6a75232b58a37 .gallery-item { position: relative; width: 100%; height: 200px; overflow: hidden; border-radius: 4px; margin: 0; padding: 0; display: block; } #picture-order-6a75232b58a37 img { width: 100%; height: 100%; object-fit: cover; display: block; margin: 0; padding: 0; border: none; vertical-align: top; } /* 修复文字溢出：通用标签样式 */ #picture-order-6a75232b58a37 .film-label { max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; box-sizing: border-box; } /* 移动端响应式调整 */ @media (max-width: 1024px) { #picture-order-6a75232b58a37 { grid-template-columns: repeat(2, 1fr); gap: 7.2px; } #picture-order-6a75232b58a37 .gallery-item { height: 160px !important; } } @media (max-width: 768px) { #picture-order-6a75232b58a37 { gap: 6.4px; } } @media (max-width: 480px) { #picture-order-6a75232b58a37 { gap: 5.6px; } } /* PictureOrder Frame Styles */ #picture-order-6a75232b58a37 .gallery-item { background-color: #fff; padding: 18px; border: 1px solid #e0e0e0; border-radius: 8px; box-sizing: border-box; transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1); box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04); position: relative; } #picture-order-6a75232b58a37 .gallery-item::before { content: ''; position: absolute; top: 8px; left: 8px; right: 8px; bottom: 8px; border: 1px solid #f5f5f5; border-radius: 4px; pointer-events: none; } #picture-order-6a75232b58a37 .gallery-item img { border-radius: 4px; transition: transform 0.3s ease; } #picture-order-6a75232b58a37 .gallery-item:hover { border-color: #c0c0c0; box-shadow: 0 4px 16px rgba(0, 0, 0, 0.08); transform: translateY(-2px); } #picture-order-6a75232b58a37 .gallery-item:hover img { transform: scale(1.02); } 1 2 3 前台演示 /* PictureOrder Gallery Styles */ #picture-order-6a75232b58a55 { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; width: 100%; margin: 0; padding: 0; line-height: 0; font-size: 0; } #picture-order-6a75232b58a55 .gallery-item { position: relative; width: 100%; height: 200px; overflow: hidden; border-radius: 4px; margin: 0; padding: 0; display: block; } #picture-order-6a75232b58a55 img { width: 100%; height: 100%; object-fit: cover; display: block; margin: 0; padding: 0; border: none; vertical-align: top; } /* 修复文字溢出：通用标签样式 */ #picture-order-6a75232b58a55 .film-label { max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; box-sizing: border-box; } /* 移动端响应式调整 */ @media (max-width: 1024px) { #picture-order-6a75232b58a55 { grid-template-columns: repeat(2, 1fr); gap: 7.2px; } #picture-order-6a75232b58a55 .gallery-item { height: 160px !important; } } @media (max-width: 768px) { #picture-order-6a75232b58a55 { gap: 6.4px; } } @media (max-width: 480px) { #picture-order-6a75232b58a55 { gap: 5.6px; } } /* PictureOrder Frame Styles */ #picture-order-6a75232b58a55 .gallery-item { background-color: #fff; padding: 18px; border: 1px solid #e0e0e0; border-radius: 8px; box-sizing: border-box; transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1); box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04); position: relative; } #picture-order-6a75232b58a55 .gallery-item::before { content: ''; position: absolute; top: 8px; left: 8px; right: 8px; bottom: 8px; border: 1px solid #f5f5f5; border-radius: 4px; pointer-events: none; } #picture-order-6a75232b58a55 .gallery-item img { border-radius: 4px; transition: transform 0.3s ease; } #picture-order-6a75232b58a55 .gallery-item:hover { border-color: #c0c0c0; box-shadow: 0 4px 16px rgba(0, 0, 0, 0.08); transform: translateY(-2px); } #picture-order-6a75232b58a55 .gallery-item:hover img { transform: scale(1.02); } 4 5 6 如果插件对你有帮助，记得点亮小星星 ✨快速使用创建新页面，输入短代码即可调用： [gallery#] 更新日志v1.3.0优化：兼容夜间模式优化：外链图片/视频存储逻辑v1.2.0新增：图片/视频支持外链批量上传优化：相册打开动画默认开启v1.1.1优化：修复图片介绍无法跟随灯箱问题优化：相册弹窗圆角效果v1.1.0新增：图片排版支持常规/瀑布流切换新增：图片可移动至指定相册新增：后台图片管理支持全选新增：6 种相册打开动画自定义新增：图片自定义说明新增：相册与图片拖动排序优化：修复前台弹窗图片穿模问题v1.0.1新增：本地图片扫描插入功能新增：后台“本地”标识，区分上传与本地图片新增：本地图片删除保护机制，仅删记录不删文件优化：统一前后台图片路径逻辑，修复显示异常优化：WebP 压缩内存安全机制，防止大图处理失败 插件信息当前版本：1.3.0适用平台：Typecho 1.3.0+作者：落花雨记主页：https://www.luohuayu.cn 功能特性📂 混合管理模式支持直接上传图片/视频支持一键扫描并插入服务器已有图片后台智能标识“本地”图片，方便区分管理⚙️ 智能压缩处理可选开启 WebP 自动压缩，节省服务器空间自定义压缩质量（0–100）智能内存管理，大图处理稳定🔒 安全与权限支持为相册设置独立访问密码本地图片删除仅移除记录，保护源文件安全🎨 前端体验自适应布局，兼容 PC 与移动端自定义每行显示数量支持视频直接在线播放弹窗画廊式浏览体验 环境要求PHP 版本：7.0+（推荐 7.4+）数据库：MySQLPHP 扩展：GD2、PDO_MYSQL 安装使用方法1. 下载插件后，将文件夹重命名为 SmartGallery ，上传至 /usr/plugins/ 目录2. 进入后台 → 插件管理 → 启用 Smart Gallery3. 进入插件设置，配置显示参数与压缩选项4. 在后台「控制台 → 相册管理」中创建并管理相册5. 在文章或页面中使用短代码 [gallery#] 调用展示放在GitHub了，大佬们帮忙测试下有没有bug：https://github.com/3554171776/Smart-Gallery.git
有时候好久不更新，确实也没啥更新的，博客我主要就是用来当日记本了，偶尔想发个牢骚，发片文章几个字又感觉挺水的，哈哈哈。刚好oneblog主题自带有微语功能，通过Typecho的评论系统构建，但是主题主打一个轻量并没有加入微语回复功能，刚好最近公司放假了在家没事干，瞎折腾。目前微语已经支持评论功能，并且加入了邮件通知和表情包，邮件通知使用PHPMailer，表情包使用张洪Heo的开源项目目前测试了一下，好像都没啥大毛病，样式有点像朋友圈，哈哈哈，感觉看着还行。微语地址：https://www.luohuayu.cn/weiyu.html目前把微语融入到博客首页，按照时间发布和文章混在一起可以用来平时记录一些细言碎语`(∩_∩)′
看了下博客的收录情况，竟然只有个首页，，哈哈哈，虽然个人博客我感觉收录也没啥用吧，但是有总比没有好是吧，在几个优秀博主网站下了几个推送插件，不知道为啥没有效果，可能是我配置的问题(¯―¯٥)于是丢在了我训练了N次的AI里面，历经“千辛万苦”终于成功训练出了BingApiSubmit推送插件，AI真好用 ᖰ⌯'▾'⌯ᖳ，完全不用动🧠了 /* PictureOrder Gallery Styles */ #picture-order-6a75232b5b491 { display: grid; grid-template-columns: repeat(1, 1fr); gap: 8px; width: 100%; margin: 0; padding: 0; line-height: 0; font-size: 0; } #picture-order-6a75232b5b491 .gallery-item { position: relative; width: 100%; height: 600px; overflow: hidden; border-radius: 4px; margin: 0; padding: 0; display: block; } #picture-order-6a75232b5b491 img { width: 100%; height: 100%; object-fit: cover; display: block; margin: 0; padding: 0; border: none; vertical-align: top; } /* 修复文字溢出：通用标签样式 */ #picture-order-6a75232b5b491 .film-label { max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; box-sizing: border-box; } /* 移动端响应式调整 */ @media (max-width: 1024px) { #picture-order-6a75232b5b491 { grid-template-columns: repeat(1, 1fr); gap: 7.2px; } #picture-order-6a75232b5b491 .gallery-item { height: 320px !important; } } @media (max-width: 768px) { #picture-order-6a75232b5b491 { gap: 6.4px; } } @media (max-width: 480px) { #picture-order-6a75232b5b491 { gap: 5.6px; } } /* PictureOrder Frame Styles */ #picture-order-6a75232b5b491 .gallery-item { background-color: #fff; padding: 18px; border: 1px solid #e0e0e0; border-radius: 8px; box-sizing: border-box; transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1); box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04); position: relative; } #picture-order-6a75232b5b491 .gallery-item::before { content: ''; position: absolute; top: 8px; left: 8px; right: 8px; bottom: 8px; border: 1px solid #f5f5f5; border-radius: 4px; pointer-events: none; } #picture-order-6a75232b5b491 .gallery-item img { border-radius: 4px; transition: transform 0.3s ease; } #picture-order-6a75232b5b491 .gallery-item:hover { border-color: #c0c0c0; box-shadow: 0 4px 16px rgba(0, 0, 0, 0.08); transform: translateY(-2px); } #picture-order-6a75232b5b491 .gallery-item:hover img { transform: scale(1.02); } 3 插件支持同时使用Bing API和IndexNow API进行文章推送，新文章发布或者更新旧文章及页面时，插件会进行自动推送，并反馈状态码至插件日志。设置页面添加了手动随机推送，建议是10条推送哈，因为我推送全部，给我的小机卡死了T﹏T插件适配1.2.1版本 其他版本不知道能不能用～ /* PictureOrder Gallery Styles */ #picture-order-6a75232b5b4b3 { display: grid; grid-template-columns: repeat(2, 1fr); gap: 8px; width: 100%; margin: 0; padding: 0; line-height: 0; font-size: 0; } #picture-order-6a75232b5b4b3 .gallery-item { position: relative; width: 100%; height: 300px; overflow: hidden; border-radius: 4px; margin: 0; padding: 0; display: block; } #picture-order-6a75232b5b4b3 img { width: 100%; height: 100%; object-fit: cover; display: block; margin: 0; padding: 0; border: none; vertical-align: top; } /* 修复文字溢出：通用标签样式 */ #picture-order-6a75232b5b4b3 .film-label { max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; box-sizing: border-box; } /* 移动端响应式调整 */ @media (max-width: 1024px) { #picture-order-6a75232b5b4b3 { grid-template-columns: repeat(2, 1fr); gap: 7.2px; } #picture-order-6a75232b5b4b3 .gallery-item { height: 160px !important; } } @media (max-width: 768px) { #picture-order-6a75232b5b4b3 { gap: 6.4px; } } @media (max-width: 480px) { #picture-order-6a75232b5b4b3 { gap: 5.6px; } } /* PictureOrder Frame Styles */ #picture-order-6a75232b5b4b3 .gallery-item { background-color: #fff; padding: 18px; border: 1px solid #e0e0e0; border-radius: 8px; box-sizing: border-box; transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1); box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04); position: relative; } #picture-order-6a75232b5b4b3 .gallery-item::before { content: ''; position: absolute; top: 8px; left: 8px; right: 8px; bottom: 8px; border: 1px solid #f5f5f5; border-radius: 4px; pointer-events: none; } #picture-order-6a75232b5b4b3 .gallery-item img { border-radius: 4px; transition: transform 0.3s ease; } #picture-order-6a75232b5b4b3 .gallery-item:hover { border-color: #c0c0c0; box-shadow: 0 4px 16px rgba(0, 0, 0, 0.08); transform: translateY(-2px); } #picture-order-6a75232b5b4b3 .gallery-item:hover img { transform: scale(1.02); } 1 2 有需要的小伙伴自取：此处内容已隐藏，回复后(需要填写邮箱)可见 /* PictureOrder Gallery Styles */ #picture-order-6a75232b5b4ca { display: grid; grid-template-columns: repeat(2, 1fr); gap: 8px; width: 100%; margin: 0; padding: 0; line-height: 0; font-size: 0; } #picture-order-6a75232b5b4ca .gallery-item { position: relative; width: 100%; height: 300px; overflow: hidden; border-radius: 4px; margin: 0; padding: 0; display: block; } #picture-order-6a75232b5b4ca img { width: 100%; height: 100%; object-fit: cover; display: block; margin: 0; padding: 0; border: none; vertical-align: top; } /* 修复文字溢出：通用标签样式 */ #picture-order-6a75232b5b4ca .film-label { max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; box-sizing: border-box; } /* 移动端响应式调整 */ @media (max-width: 1024px) { #picture-order-6a75232b5b4ca { grid-template-columns: repeat(2, 1fr); gap: 7.2px; } #picture-order-6a75232b5b4ca .gallery-item { height: 160px !important; } } @media (max-width: 768px) { #picture-order-6a75232b5b4ca { gap: 6.4px; } } @media (max-width: 480px) { #picture-order-6a75232b5b4ca { gap: 5.6px; } } /* PictureOrder Frame Styles */ #picture-order-6a75232b5b4ca .gallery-item { background-color: #fff; padding: 18px; border: 1px solid #e0e0e0; border-radius: 8px; box-sizing: border-box; transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1); box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04); position: relative; } #picture-order-6a75232b5b4ca .gallery-item::before { content: ''; position: absolute; top: 8px; left: 8px; right: 8px; bottom: 8px; border: 1px solid #f5f5f5; border-radius: 4px; pointer-events: none; } #picture-order-6a75232b5b4ca .gallery-item img { border-radius: 4px; transition: transform 0.3s ease; } #picture-order-6a75232b5b4ca .gallery-item:hover { border-color: #c0c0c0; box-shadow: 0 4px 16px rgba(0, 0, 0, 0.08); transform: translateY(-2px); } #picture-order-6a75232b5b4ca .gallery-item:hover img { transform: scale(1.02); } 1000066386 1000066389 鸡蛋盐放多了，豇豆出锅忘记尝了半熟，又炒了一遍，这算不算回锅肉？
折腾的东西越来越多，昨晚删错东西，又给整崩了，这篇文章，当个备份用，哈哈哈。本博客基于Typecho1.2.1搭建，搭配开源主题oneblog～https://docs.oneblog.net/评论区域comments1.显示评论这归属地，使用XQLocation插件，合适位置调用<?php XQLocation_Plugin::render($comments->ip); ?>css样式/彩色渐变美化/* IP归属地样式 */ .comment-location { font-size: 12px; font-weight: bold; background: linear-gradient(45deg, #f093fb, #f5576c, #4facfe, #00f2fe, #43e97b, #fa709a, #fee140); background-size: 400% 400%; -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; animation: gradient-shift 4s ease infinite; margin-left: 8px; } 2.评论框添加每日一言添加css样式/* 富文本编辑器一言占位符样式 */ .rich-editor-hitokoto[contenteditable="true"]:empty:before { content: attr(data-placeholder); color: #aaa; font-style: italic; pointer-events: none; display: block; } .rich-editor-hitokoto[contenteditable="true"]:focus:before { color: #ccc; } 添加引用JS 评论框 首页/底部菜单栏/顶部菜单栏css1.首页文章分割线美化样式.post { border-bottom: none !important; position: relative; padding-bottom: 35px; margin-bottom: 35px; } .post::after { content: '〰️ 〰️ 〰️ 〰️ 〰️'; position: absolute; bottom: 8px; left: 0; width: 100%; text-align: center; font-size: 20px; letter-spacing: 6px; opacity: 0.7; transition: all 0.3s ease; /* 创建渐变效果 */ background: linear-gradient(90deg, #d4c5b9, #8b7355, #d4c5b9); -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text; } .post:hover::after { opacity: 1; font-size: 22px; letter-spacing: 8px; /* 悬停时渐变更明显 */ background: linear-gradient(90deg, #8b7355, #d4c5b9, #8b7355); -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text; } .post:last-child::after { display: none; }2.PC端顶部菜单栏样式header/* PC端导航栏样式 */ .pc-header { position: sticky; top: 0; background: #fff; box-shadow: 0 2px 10px rgba(0,0,0,0.1); z-index: 1000; display: none; /* 默认隐藏，只在PC端显示 */ } .nav-container { max-width: 1200px; margin: 0 auto; display: flex; justify-content: space-between; align-items: center; padding: 0 20px; height: 60px; } .nav-logo img { height: 40px; width: auto; } .nav-menu { display: flex; list-style: none; margin: 0; padding: 0; gap: 30px; } .nav-menu a { text-decoration: none; color: #333; font-weight: 500; transition: color 0.3s; position: relative; } .nav-menu a:hover, .nav-menu a.active { color: var(--theme-color); } .nav-menu a.active::after { content: ''; position: absolute; bottom: -5px; left: 0; right: 0; height: 2px; background: var(--theme-color); } /* 响应式显示控制 */ @media (min-width: 768px) { .pc-header { display: block; } } /* 暗色模式适配 */ .night .pc-header { background: #2d2d2d; box-shadow: 0 2px 10px rgba(0,0,0,0.3); } .night .nav-menu a { color: #e0e0e0; } 未完待续～
最近给博客做了一些小美化(≧ｗ≦)添加了随机文章页面，随机展现网站的某一篇文章：随便看看前台添加Live2D看板娘，只添加了最基础的看板娘版本，刚好用来跳转随机文章，哈哈哈基础版： /* PictureOrder Gallery Styles */ #picture-order-6a75232b5c489 { display: grid; grid-template-columns: repeat(2, 1fr); gap: 8px; width: 100%; margin: 0; padding: 0; line-height: 0; font-size: 0; } #picture-order-6a75232b5c489 .gallery-item { position: relative; width: 100%; height: 300px; overflow: hidden; border-radius: 4px; margin: 0; padding: 0; display: block; } #picture-order-6a75232b5c489 img { width: 100%; height: 100%; object-fit: cover; display: block; margin: 0; padding: 0; border: none; vertical-align: top; } /* 修复文字溢出：通用标签样式 */ #picture-order-6a75232b5c489 .film-label { max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; box-sizing: border-box; } /* 移动端响应式调整 */ @media (max-width: 1024px) { #picture-order-6a75232b5c489 { grid-template-columns: repeat(2, 1fr); gap: 7.2px; } #picture-order-6a75232b5c489 .gallery-item { height: 160px !important; } } @media (max-width: 768px) { #picture-order-6a75232b5c489 { gap: 6.4px; } } @media (max-width: 480px) { #picture-order-6a75232b5c489 { gap: 5.6px; } } /* PictureOrder Frame Styles */ #picture-order-6a75232b5c489 .gallery-item { background-color: #fff; padding: 18px; border: 1px solid #e0e0e0; border-radius: 8px; box-sizing: border-box; transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1); box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04); position: relative; } #picture-order-6a75232b5c489 .gallery-item::before { content: ''; position: absolute; top: 8px; left: 8px; right: 8px; bottom: 8px; border: 1px solid #f5f5f5; border-radius: 4px; pointer-events: none; } #picture-order-6a75232b5c489 .gallery-item img { border-radius: 4px; transition: transform 0.3s ease; } #picture-order-6a75232b5c489 .gallery-item:hover { border-color: #c0c0c0; box-shadow: 0 4px 16px rgba(0, 0, 0, 0.08); transform: translateY(-2px); } #picture-order-6a75232b5c489 .gallery-item:hover img { transform: scale(1.02); } 1000065426 1000065430 添加了评论排行榜页面 看了各位大佬的博客好像都有，必须搞一个，紧跟潮流，刚好放在评论框右下方，不过好像有点不是很美观༎ຶ‿༎ຶ /* PictureOrder Gallery Styles */ #picture-order-6a75232b5c49d { display: grid; grid-template-columns: repeat(2, 1fr); gap: 8px; width: 100%; margin: 0; padding: 0; line-height: 0; font-size: 0; } #picture-order-6a75232b5c49d .gallery-item { position: relative; width: 100%; height: 300px; overflow: hidden; border-radius: 4px; margin: 0; padding: 0; display: block; } #picture-order-6a75232b5c49d img { width: 100%; height: 100%; object-fit: cover; display: block; margin: 0; padding: 0; border: none; vertical-align: top; } /* 修复文字溢出：通用标签样式 */ #picture-order-6a75232b5c49d .film-label { max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; box-sizing: border-box; } /* 移动端响应式调整 */ @media (max-width: 1024px) { #picture-order-6a75232b5c49d { grid-template-columns: repeat(2, 1fr); gap: 7.2px; } #picture-order-6a75232b5c49d .gallery-item { height: 160px !important; } } @media (max-width: 768px) { #picture-order-6a75232b5c49d { gap: 6.4px; } } @media (max-width: 480px) { #picture-order-6a75232b5c49d { gap: 5.6px; } } /* PictureOrder Frame Styles */ #picture-order-6a75232b5c49d .gallery-item { background-color: #fff; padding: 18px; border: 1px solid #e0e0e0; border-radius: 8px; box-sizing: border-box; transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1); box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04); position: relative; } #picture-order-6a75232b5c49d .gallery-item::before { content: ''; position: absolute; top: 8px; left: 8px; right: 8px; bottom: 8px; border: 1px solid #f5f5f5; border-radius: 4px; pointer-events: none; } #picture-order-6a75232b5c49d .gallery-item img { border-radius: 4px; transition: transform 0.3s ease; } #picture-order-6a75232b5c49d .gallery-item:hover { border-color: #c0c0c0; box-shadow: 0 4px 16px rgba(0, 0, 0, 0.08); transform: translateY(-2px); } #picture-order-6a75232b5c49d .gallery-item:hover img { transform: scale(1.02); } 1000065432 1000065434 明天去接老爸转院，不知道为啥这边的康复医院消费满2w或者住满一个月就不让住了，必须去其他医院住，或者回家一周再过来重新办理住院，好奇怪(／_＼)刚好这几天调休，回去陪陪老爸(ง •̀_•́)ง最后，人是铁，饭是钢，干饭最重要(っ˘ڡ˘ς) /* PictureOrder Gallery Styles */ #picture-order-6a75232b5c4a7 { display: grid; grid-template-columns: repeat(1, 1fr); gap: 8px; width: 100%; margin: 0; padding: 0; line-height: 0; font-size: 0; } #picture-order-6a75232b5c4a7 .gallery-item { position: relative; width: 100%; height: 600px; overflow: hidden; border-radius: 4px; margin: 0; padding: 0; display: block; } #picture-order-6a75232b5c4a7 img { width: 100%; height: 100%; object-fit: cover; display: block; margin: 0; padding: 0; border: none; vertical-align: top; } /* 修复文字溢出：通用标签样式 */ #picture-order-6a75232b5c4a7 .film-label { max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; box-sizing: border-box; } /* 移动端响应式调整 */ @media (max-width: 1024px) { #picture-order-6a75232b5c4a7 { grid-template-columns: repeat(1, 1fr); gap: 7.2px; } #picture-order-6a75232b5c4a7 .gallery-item { height: 320px !important; } } @media (max-width: 768px) { #picture-order-6a75232b5c4a7 { gap: 6.4px; } } @media (max-width: 480px) { #picture-order-6a75232b5c4a7 { gap: 5.6px; } } /* PictureOrder Frame Styles */ #picture-order-6a75232b5c4a7 .gallery-item { background-color: #fff; padding: 18px; border: 1px solid #e0e0e0; border-radius: 8px; box-sizing: border-box; transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1); box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04); position: relative; } #picture-order-6a75232b5c4a7 .gallery-item::before { content: ''; position: absolute; top: 8px; left: 8px; right: 8px; bottom: 8px; border: 1px solid #f5f5f5; border-radius: 4px; pointer-events: none; } #picture-order-6a75232b5c4a7 .gallery-item img { border-radius: 4px; transition: transform 0.3s ease; } #picture-order-6a75232b5c4a7 .gallery-item:hover { border-color: #c0c0c0; box-shadow: 0 4px 16px rgba(0, 0, 0, 0.08); transform: translateY(-2px); } #picture-order-6a75232b5c4a7 .gallery-item:hover img { transform: scale(1.02); } 1000065439
记录一下最近在忙的事情(๑-﹏-๑)首先是家里的事情，老爸目前已经从住院部出院，转到康复中心了，本来应该是没啥问题的，结果由于长时间卧槽导致肠胃不蠕动，肚子里大便钙化了，:-(。没办法只能禁水禁食，老妈一个人在医院又跑不过来，我又得上班，最后综合考虑请了护工一天150，不过确实护工也比较好，请了之后老妈的负担也小了，我这边也可以安心工作了，目前就是每天做康复训练，老妈在医院陪护，希望早日康复⁄(⁄⁄•⁄ω⁄•⁄⁄)⁄工作上由于我也是刚到这家公司，属于长城旗下做汽车零部件的厂子，之前也没有接触过汽车这块的自动化，目前感觉的话还是比较难搞的，不过好在公司目前比较闲，刚好方便照顾家人。后期的话还是考虑做光伏这一块吧，毕竟做了这么多年了，现在再重新学习新的东西也有点学不进去了，刚好苏州这边有一个光伏的新项目在招人，昨天投了简历，说是会进行筛选，希望能通过吧(ง •̀_•́)ง然后最近搞了一个RSS的聚合插件，目前使用和展示效果感觉还好，具体可以看RSS友圈，后面有空想加几个页面的美化，再优化一下加载速度，目前感觉有点卡，大家有啥好意见可以留言哈 /* PictureOrder Gallery Styles */ #picture-order-6a75232b5cb4a { display: grid; grid-template-columns: repeat(2, 1fr); gap: 8px; width: 100%; margin: 0; padding: 0; line-height: 0; font-size: 0; } #picture-order-6a75232b5cb4a .gallery-item { position: relative; width: 100%; height: 300px; overflow: hidden; border-radius: 4px; margin: 0; padding: 0; display: block; } #picture-order-6a75232b5cb4a img { width: 100%; height: 100%; object-fit: cover; display: block; margin: 0; padding: 0; border: none; vertical-align: top; } /* 修复文字溢出：通用标签样式 */ #picture-order-6a75232b5cb4a .film-label { max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; box-sizing: border-box; } /* 移动端响应式调整 */ @media (max-width: 1024px) { #picture-order-6a75232b5cb4a { grid-template-columns: repeat(2, 1fr); gap: 7.2px; } #picture-order-6a75232b5cb4a .gallery-item { height: 160px !important; } } @media (max-width: 768px) { #picture-order-6a75232b5cb4a { gap: 6.4px; } } @media (max-width: 480px) { #picture-order-6a75232b5cb4a { gap: 5.6px; } } /* PictureOrder Frame Styles */ #picture-order-6a75232b5cb4a .gallery-item { background-color: #fff; padding: 18px; border: 1px solid #e0e0e0; border-radius: 8px; box-sizing: border-box; transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1); box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04); position: relative; } #picture-order-6a75232b5cb4a .gallery-item::before { content: ''; position: absolute; top: 8px; left: 8px; right: 8px; bottom: 8px; border: 1px solid #f5f5f5; border-radius: 4px; pointer-events: none; } #picture-order-6a75232b5cb4a .gallery-item img { border-radius: 4px; transition: transform 0.3s ease; } #picture-order-6a75232b5cb4a .gallery-item:hover { border-color: #c0c0c0; box-shadow: 0 4px 16px rgba(0, 0, 0, 0.08); transform: translateY(-2px); } #picture-order-6a75232b5cb4a .gallery-item:hover img { transform: scale(1.02); } 1000064264 1000064266 最后分享一下我的小锅巴 /* PictureOrder Gallery Styles */ #picture-order-6a75232b5cb5c { display: grid; grid-template-columns: repeat(1, 1fr); gap: 8px; width: 100%; margin: 0; padding: 0; line-height: 0; font-size: 0; } #picture-order-6a75232b5cb5c .gallery-item { position: relative; width: 100%; height: 600px; overflow: hidden; border-radius: 4px; margin: 0; padding: 0; display: block; } #picture-order-6a75232b5cb5c img { width: 100%; height: 100%; object-fit: cover; display: block; margin: 0; padding: 0; border: none; vertical-align: top; } /* 修复文字溢出：通用标签样式 */ #picture-order-6a75232b5cb5c .film-label { max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; box-sizing: border-box; } /* 移动端响应式调整 */ @media (max-width: 1024px) { #picture-order-6a75232b5cb5c { grid-template-columns: repeat(1, 1fr); gap: 7.2px; } #picture-order-6a75232b5cb5c .gallery-item { height: 320px !important; } } @media (max-width: 768px) { #picture-order-6a75232b5cb5c { gap: 6.4px; } } @media (max-width: 480px) { #picture-order-6a75232b5cb5c { gap: 5.6px; } } /* PictureOrder Frame Styles */ #picture-order-6a75232b5cb5c .gallery-item { background-color: #fff; padding: 18px; border: 1px solid #e0e0e0; border-radius: 8px; box-sizing: border-box; transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1); box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04); position: relative; } #picture-order-6a75232b5cb5c .gallery-item::before { content: ''; position: absolute; top: 8px; left: 8px; right: 8px; bottom: 8px; border: 1px solid #f5f5f5; border-radius: 4px; pointer-events: none; } #picture-order-6a75232b5cb5c .gallery-item img { border-radius: 4px; transition: transform 0.3s ease; } #picture-order-6a75232b5cb5c .gallery-item:hover { border-color: #c0c0c0; box-shadow: 0 4px 16px rgba(0, 0, 0, 0.08); transform: translateY(-2px); } #picture-order-6a75232b5cb5c .gallery-item:hover img { transform: scale(1.02); } 1000064272
用惯了WordPress，之前使用的主题移动端基本都带底部导航，看习惯了，换成Typecho搭配oneblog主题之后，移动端底部没有导航栏，不太习惯，自己瞎捣鼓了一个，感介又不太好看，索性加了一个悬浮球装饰。功能比较简单，支持左右两个位置自定义选择，目前是加了3个子悬浮球，太多了也不美观，个人感觉3个刚刚好，可以自定义开启。图标建议使用阿里图标库，直接下载PNG透明图标使用即可。图标链接直接填写URL或者你需要的JS事件。推荐JS使用：1.联系QQ：javascript:window.location.href='mqqwpa://im/chat?chat_type=wpa&uin=你的QQ&version=1&src_type=web&web_src=oicqzone.com';2：联系邮箱：javascript:location.href='mailto:你的邮箱'3：图片弹出：javascript:(()=>{const existing=document.getElementById('popupContainer');if(existing)existing.remove();else{const container=document.createElement('div');container.id='popupContainer';container.style.position='fixed';container.style.top='0';container.style.left='0';container.style.width='100%';container.style.height='100%';container.style.zIndex='9998';container.onclick=()=>container.remove();const img=document.createElement('img');img.src='你的图片地址';img.style.position='fixed';img.style.top='50%';img.style.left='50%';img.style.transform='translate(-50%, -50%)';img.style.zIndex='9999';img.style.boxShadow='0 0 20px rgba(0,0,0,0.3)';img.style.maxWidth='90%';img.style.maxHeight='90vh';img.onclick=e=>e.stopPropagation();container.appendChild(img);document.body.appendChild(container);}})();插件功能比较鸡肋哈，不过用来装饰还是不错滴，填填联系方式啥的，哈哈哈。 /* PictureOrder Gallery Styles */ #picture-order-6a75232b5d193 { display: grid; grid-template-columns: repeat(2, 1fr); gap: 8px; width: 100%; margin: 0; padding: 0; line-height: 0; font-size: 0; } #picture-order-6a75232b5d193 .gallery-item { position: relative; width: 100%; height: 300px; overflow: hidden; border-radius: 4px; margin: 0; padding: 0; display: block; } #picture-order-6a75232b5d193 img { width: 100%; height: 100%; object-fit: cover; display: block; margin: 0; padding: 0; border: none; vertical-align: top; } /* 修复文字溢出：通用标签样式 */ #picture-order-6a75232b5d193 .film-label { max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; box-sizing: border-box; } /* 移动端响应式调整 */ @media (max-width: 1024px) { #picture-order-6a75232b5d193 { grid-template-columns: repeat(2, 1fr); gap: 7.2px; } #picture-order-6a75232b5d193 .gallery-item { height: 160px !important; } } @media (max-width: 768px) { #picture-order-6a75232b5d193 { gap: 6.4px; } } @media (max-width: 480px) { #picture-order-6a75232b5d193 { gap: 5.6px; } } /* PictureOrder Frame Styles */ #picture-order-6a75232b5d193 .gallery-item { background-color: #fff; padding: 18px; border: 1px solid #e0e0e0; border-radius: 8px; box-sizing: border-box; transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1); box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04); position: relative; } #picture-order-6a75232b5d193 .gallery-item::before { content: ''; position: absolute; top: 8px; left: 8px; right: 8px; bottom: 8px; border: 1px solid #f5f5f5; border-radius: 4px; pointer-events: none; } #picture-order-6a75232b5d193 .gallery-item img { border-radius: 4px; transition: transform 0.3s ease; } #picture-order-6a75232b5d193 .gallery-item:hover { border-color: #c0c0c0; box-shadow: 0 4px 16px rgba(0, 0, 0, 0.08); transform: translateY(-2px); } #picture-order-6a75232b5d193 .gallery-item:hover img { transform: scale(1.02); } 1000064074 1000064076 下载地址此处内容已隐藏，回复后(需要填写邮箱)可见
第一次使用Typecho，写完文章发现图片无法手动排版，Typecho默认排版非常不符合我个人的审美，感觉杂乱无章。所以有了PictureOrder插件，插件支持文章图片自适应排版和自定义排版，功能不是很完善，但是目前够用了，至少文章图片不是那么乱了PS：此插件结合AI模型产出，测试本站完全兼容，有建议及BUG请评论留言，大佬勿喷哈！效果展示 /* PictureOrder Gallery Styles */ #picture-order-6a75232b5da2d { display: grid; grid-template-columns: repeat(4, 1fr); gap: 8px; width: 100%; margin: 0; padding: 0; line-height: 0; font-size: 0; } #picture-order-6a75232b5da2d .gallery-item { position: relative; width: 100%; height: 150px; overflow: hidden; border-radius: 4px; margin: 0; padding: 0; display: block; } #picture-order-6a75232b5da2d img { width: 100%; height: 100%; object-fit: cover; display: block; margin: 0; padding: 0; border: none; vertical-align: top; } /* 修复文字溢出：通用标签样式 */ #picture-order-6a75232b5da2d .film-label { max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; box-sizing: border-box; } /* 移动端响应式调整 */ @media (max-width: 1024px) { #picture-order-6a75232b5da2d { grid-template-columns: repeat(2, 1fr); gap: 7.2px; } #picture-order-6a75232b5da2d .gallery-item { height: 160px !important; } } @media (max-width: 768px) { #picture-order-6a75232b5da2d { gap: 6.4px; } } @media (max-width: 480px) { #picture-order-6a75232b5da2d { gap: 5.6px; } } /* PictureOrder Frame Styles */ #picture-order-6a75232b5da2d .gallery-item { background-color: #fff; padding: 18px; border: 1px solid #e0e0e0; border-radius: 8px; box-sizing: border-box; transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1); box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04); position: relative; } #picture-order-6a75232b5da2d .gallery-item::before { content: ''; position: absolute; top: 8px; left: 8px; right: 8px; bottom: 8px; border: 1px solid #f5f5f5; border-radius: 4px; pointer-events: none; } #picture-order-6a75232b5da2d .gallery-item img { border-radius: 4px; transition: transform 0.3s ease; } #picture-order-6a75232b5da2d .gallery-item:hover { border-color: #c0c0c0; box-shadow: 0 4px 16px rgba(0, 0, 0, 0.08); transform: translateY(-2px); } #picture-order-6a75232b5da2d .gallery-item:hover img { transform: scale(1.02); } 1000063717 1000063718 1000063720 1000063719 插件结构PictureOrder/ ├── Plugin.php # 主插件入口 ├── Action/ │ └── Handler.php # 处理内容解析和回调 ├── Helper/ │ ├── Image.php # 图片处理工具 │ └── Layout.php # 布局生成工具 ├── Config.php # 插件配置管理 └── assets/ ├── css/ │ └── style.css # 插件样式表 └── js/ └── lazyload.js # 图片懒加载脚本更新记录V1.0：插件发布V1.1：优化图片显示不匀称等bug统一桌面端及移动端图片显示比例去除无关紧要的功能使用方法下载PictureOrder插件后上传到对应插件目录解压即可，解压后需保证插件名为PictureOrder即可，Typecho后台激活启用插件，根据需求设置插件。默认模式：根据你短代码内部图片的数量进行横向自动排列自定义模式：自定义横向排列数量，多出来的自动换行进行二次排列下载地址此处内容已隐藏，回复后(需要填写邮箱)可见