首页
友链
归档
推荐
LOVE
Search
1
京东PLUS会员送的体检体验如何?
887 阅读
2
入手绿源ZN10电动车
676 阅读
3
时隔ICP备案半个月,又完成了网安备案
665 阅读
4
申请又拍云联盟 免费使用CDN和云存储(对象存储)服务
514 阅读
5
Typecho 新版又拍云插件使用教程
457 阅读
生活日记
微言微语
建站交流
资源分享
登录
Search
Hary
累计撰写
99
篇文章
累计收到
300
条评论
首页
分类
生活日记
微言微语
建站交流
资源分享
页面
友链
归档
推荐
LOVE
搜索到
34
篇与
的结果
2024-10-19
给博客加上了WWW
最近发现必应的收录莫名其妙一下全没了,也不知道触发了啥,就很突然,然后site了下百度还有,一直都是用的@主域名做主页访问,www跳转到@的,我看百度收录主页也是只收录了个www的,百度的之前我是在站长平台提交站点的时候就发现是只能提交www的网址,直接@主域名是不支持的,WWW万维网的由来历史久远,可以搜一下具体看看是个啥,可能也是这种历史习惯吧,基本上大的网站还都是主页是用www的。最近两年好像对www的体现都弱化了很多,基本上都是@跳转到www,一般输入也都是直接输入主域名而不用输入www,现在电脑浏览器上面好多也都是直接不显示www前缀了,以前我也都是一直挺喜欢直接用主域名的,键盘输入的时候包括看着也简短一点,这次必应莫名其妙的收录全部消失之后,就想着还是加上个www吧,也更符合大众习惯用法和被搜索引擎喜欢,虽然可能收录消失并不是这个原因造成的。添加www之后做的几件事:1,登录博客后台把主域名改为带www的,不更改可能导致后台登不上。2,多吉云新增www解析,做好缓存、解析SSL相关配置,然后@的就直接在多吉云增加个重定向跳转到www,这样可以保持访问原来的某个页面可以正确跳转到带www的对应页面。3,然后就是知会加入的博客圈子改下自己的链接了,发邮件给博友圈,在github提交Issues给开往,十年之约直接登录申报链接验证自己的邮箱之后更改下订阅地址。4,某啦,随便记录一下啦。
2024年10月19日
122 阅读
0 评论
0 点赞
2024-05-20
我的图片存储和CDN应用方案
自认为目前我的站点的图片存储和CDN应用还算比较完善,安全和速度都能兼顾,特写一篇文章记录介绍一下,希望可以给看到这篇文章的你提供一点点灵感或想法,我写的都是站在我这小站日流量几百兆和域名已备案的前提下来说的,大佬勿喷哈。在用平台又拍云:网址:https://www.upyun.com/ 免费额度:每月 10GB 存储空间多吉云:网址:https://www.dogecloud.com/ 免费额度:每月 20GB CDN流量, 200万次 HTTPS 请求数上海云盾:网址:https://www.yundun.com/ 免费额度:限速5Mbps,不限制流量和请求数(正常使用范围内)Cloudflare:网址:https://www.cloudflare.com/ 免费额度:免费CDN流量,免费请求数(具体额度不详)以上免费额度只体现了本站正在使用的,未用到或者不方便使用的暂未体现。图片存储首先说下图片存储方案,图片是存储在又拍云的云存储内,文章的外链图片是通过 UpyunFile 这个插件直接通过typecho的附件上传方式直接上传到又拍云,其他的一些全局使用的图片是通过自建的 LightPicture 图床来托管的,当然这只是第一步把图片存起来,加入又拍云联盟每年有67元的代金券,我是只用又拍云的云存储,所以用这个又拍云联盟的代金券来抵扣是完全够用的;然后并没有直接使用又拍云的CDN,而是选择用多吉云的CDN来提供图片访问,就是给又拍云的云存储套上了一层多吉云的CDN,一些防盗链、访问控制、QPS限制、达量封顶都是在多吉云来设置的,如果整站的图片流量不是很大的话,月流量在20G以内基本到这就可以了,存在又拍云,访问在多吉云;如果整站图片较多,可能一个月20G流量不够用,就可以在多吉云的基础上再套上一层云盾的CDN,设置好多吉云和云盾的缓存,由于是图片不常更新,可以稍微设置长一点时间,30-60天,这一步操作就可以让图片的访问流量落在云盾的CDN上,因为云盾宣称是限速但不限制使用流量的,有一点要注意的是,当被哈巴狗攻击或者访问流量过大的时候,云盾会自动设置回源访问,所以这就是为啥云盾要套在多吉云CDN上而不是直接用云盾回源又拍云存储,当真的被回源了之后还有多吉云的QPS限制和达量封顶来兜底,不至于有什么大的损失。站点CDN加速站点CDN加速重要的一点就是国内外分流,目前本站的的CDN加速国内是托管在多吉云的,一个小破站月流量不超过20G的话,我是强烈推荐使用多吉云的CDN的,因为多吉云可以设置范围时内达量封停,这个阈值不要设置太高,我设置的5分钟超过60M则直接停止解析,这个是会有一定的延迟,但是基本上也不会太多,亲测达到300M会收到解析暂停消息,当收到这个通知,你就可以去做下一步的准备了,是继续开启或者确认受到攻击把解析换到别处。目前可用的免费CDN有的流量多一些,但是没有这个达量封停的功能,所以暂不推荐使用;国外则是 通过SAAS的方式解析在Cloudflare 上,这里有人会说小破站哪有什么国外友人访问啊,其实这里主要是为了防止境外IP攻击的,还有重要的一点就是当真被哈巴狗盯上了之后,也可以临时把国内也解析到SAAS的Cloudflare上,不需要再额外做什么防护,也能快速进行一个应急访问。结语以上介绍的仅仅为本人本站正在使用的CDN和图片存储方式,因为整站流量并不是很大,所以把各厂商免费额度结合起来完全够用了,如果站点流量稍微大一点的话也是推荐又拍云、多吉云这种融合CDN厂商的,相较于阿里腾讯,这些融合CDN厂商的单价还是很有性价比的。
2024年05月20日
298 阅读
15 评论
0 点赞
2024-04-11
给博客添加适配一个微语/说说页面
看到很多主题现在都增加了时光机/说说/微语的功能,我这用了Joe主题也好久了,很多页面也都是基于Joe主题来显示的,也不是很想换了,就想给这也弄个微语页面,我看了其他的主题的实现方式,有的是通过发布固定分类的文章,将某个分类固定为说说分类,在这个分类的文章发布之后在前台就是显示说说或者微语的形式,还有一种就是显示的一个页面的评论,更改下显示格式,来实现时光机或者微语的展现形式。找了几个主题研究了下,对于我这种不会写代码的人来说这简简单单的一个页面改起来也好难啊。。最后结合了主题的独立页面的PHP文件和标准page页面的两个文件结合了一下,也暂时实现了一个页面只显示评论,同时发布输入框设置了只有在登录之后才会显示,所欲对于读者是不显示输入框的,目前唯一的BUG就是,由于设置了发布输入框登录之后才显示,就导致访客访问微语页面点击回复出不来输入框,改来改去到现在也没整明白怎么实现访客能点击回复。。微语页面: https://hary.cc/t.html 实现效果: 未登录账号显示界面 登录账号后显示界面
2024年04月11日
213 阅读
6 评论
0 点赞
2024-04-11
利用iframe标签实现把B网页嵌套到A网页
上次搭建了恋爱计时网站的时候就在想这种嵌套实现方式,后来冲浪查了一下好像也挺简单的,用如下一行代码即可实现,高度和宽度可以根据自己的A网页的页面大小适当调整,插入到页面需要显示的地方即可,把另外简单的单页嵌套进来看起来像博客的一个页面,实现效果也挺好看的。示例标签代码 <iframe src="https://hrx.hary.cc/" width="100%" height="700"></iframe>示例页面1: 浠浠的成长日记 示例页面2: 恋爱计时器 {lamp/}{mtitle title="以下来自ChatGPT"/}当你在网页设计中需要在一个页面中嵌入另一个页面时,你可以使用HTML的<iframe>标签。这个标签允许你在一个网页中嵌入另一个网页,并且可以指定嵌入的页面的URL、宽度、高度等属性。在这篇博客中,我们将探讨如何使用<iframe>标签来实现将一个网页嵌套到另一个网页中。首先,让我们了解一下<iframe>标签的基本结构和属性。<iframe>标签的最基本形式如下:html Copy code <iframe src="URL"></iframe>在这个简单的示例中,src 属性用于指定要嵌入的网页的URL。当浏览器加载包含<iframe>标签的页面时,它将加载并显示指定URL的内容。除了 src 属性之外,<iframe>标签还有其他一些属性,比如 width 和 height,用于设置嵌入页面的宽度和高度。现在让我们来看一个具体的例子。假设我们有两个网页,A网页和B网页,我们想要在A网页中嵌入B网页。首先,我们需要在A网页的HTML代码中添加一个<iframe>标签,并设置 src 属性为B网页的URL。例如:html Copy code <!DOCTYPE html> <html> <head> <title>A网页</title> </head> <body> <h1>欢迎来到A网页</h1> <p>以下是B网页的内容:</p> <iframe src="http://www.example.com/B.html" width="600" height="400"></iframe> </body> </html>在这个例子中,我们在A网页中嵌入了一个高度为400像素、宽度为600像素的<iframe>,并且指定了B网页的URL为 http://www.example.com/B.html。当用户访问A网页时,浏览器将会加载并显示B网页的内容在A网页中的<iframe>区域内。这样,用户就可以在A网页中方便地浏览B网页的内容,而无需离开当前页面。需要注意的是,使用<iframe>标签嵌入外部网页时,要确保被嵌入的网页允许被嵌入,并且考虑到安全性问题,尽量避免在<iframe>中嵌入不受信任的内容。总之,通过使用HTML的<iframe>标签,我们可以很方便地将一个网页嵌入到另一个网页中,从而为用户提供更加丰富和便利的浏览体验。
2024年04月11日
205 阅读
0 评论
0 点赞
2024-03-04
站点境外访问接入Cloudflare实现国内外分路解析
年前的一个深夜,大晚上冲浪逛 大佬论坛 看见很多讨论域名的帖子,然后就去注册查询有没有不错的域名让我捡个漏,然后输入一大堆词组拼音组合,其中有一个kaqi.cc发现还可以注册,4字母双拼,品相还不错,还是标准的拼音词组(卡奇),然后就去西部数码直接干了10年,注册完心满意足的睡觉了。第二天起来网上找了个香港主机搭建了个测试单页,搭建好之后访问域名发现怎么都进不去,检查好几遍源码文件和域名解析还有绑定的信息,都没问题,然后访问还是进不去,显示连接已重置,后来一查才知道,显示已重置的大概率是域名被墙了,喵的,找网上工具一查果然显示域名被墙,那不当了一回纯纯大冤种么,白白浪费两百大洋,还直接给拉满十年。在大佬论讨咨询了一下,说是备案可以解除墙的拦截,我这已经有备案域名了,注册也不准备主用,还是不要备案了,最近逛 陶小桃Blog 看到可以用CloudFlare的SaaS来实现免费CNAME接入,可以达到国内外分区域访问的效果,干脆也不要浪费了这个域名,反正国内用不了,可以设置个CloudFlare中间域名用于国外访问,国内套上多吉云,设置好流量阈值,境外套上CloudFlare应该能保护好我的小破站了吧,虽然可能都不会被DD/CC的人发现我的小破站,哈哈。 想给你的站点境外也套上CloudFlare的话可以参考下上面小桃Blog写的教程,目前也是一样的步骤哈。
2024年03月04日
220 阅读
3 评论
0 点赞
2024-03-04
Typecho文章列表倒序显示,适用于1.2.1版本
这两天搭建了情侣纪念日网站,也是整的差不多了,可以点进来看看哈 Hary&Zheng 下一步研究一下看怎么用iframe方式嵌套到博客的顶栏菜单里,类似博客独立页面。其中涉及到用typecho添加100篇文章用来展示一起做过的100件事,我寻思着一下新建100篇文章那不得整老半天,就想着做几件事就写上去,想着把typecho的文章倒着显示不就能解决我这个问题,还是上网冲浪了一下,确实有这种实现方式,就记一下吧,万一后面再有这种需求翻来看代码也方便。更改方法:找到Archive.php这个文件修改找到/根目录/var/Widget/Archive.php这个文件并修改 修改Archive.php文件的第764行$select->order('table.contents.created', Db::SORT_DESC)修改为$select->order('table.contents.created', Db::SORT_ASC)然后保存文件,在前台看文章顺序即可实现最新发布的文章在列表最下面显示 效果如下: 后台文章页面: 前台文章页面:
2024年03月04日
153 阅读
0 评论
0 点赞
2024-01-20
记录两个折磨我两周的弱智问题
首先说一下时间,一件事是12月15日这个新域名备案好,解析直接就套了多吉云的CDN,还有一个就是12月22日给网站添加上恋爱计时小工具,结果就这两个事给我挖了俩大坑。。多吉云CDN引发的问题这个域名ICP备案成功之后我就直接换上了多吉云的CDN(因为多吉每月有20G的免费CDN流量),原来老域名是套的又拍云,大概是月初的时候,我回复博友的评论突然发现,我这评论的小表情咋老是加载不出来完,没有加载出来的我点击重载图像也是能出来的,说明图像存储路径应该没问题啊 实在是摸不着头脑,从上周末我就研究折腾看到底咋回事,把网页和数据库全部备份拷贝下来,在另外一台主机上传上去绑定一个新域名访问就没问题,看小表情全部都能加载出来,难道是套了CDN加载不出来吗,我看Joe主题官方站也是没有CDN,就能加载出来全部的,然后我就用这个新的域名也套上多吉的CDN发现还是没问题,我就奇了怪了,直到今天我鬼使神差的点了个加载不出来的表情图片在浏览器新页面打开,然后就出现了下面这个 不仔细看还真看不到下面还有一行小字,HTTP ERROR 514 这一看明显不就是主机服务端哪有问题吗,然后搜了下514错误代码,果然,还真被发现问题所在了,搜索结果第一个就有结果,就是说这种问题。。 看到这个,我才又突然想起来前一段时间某一天的深夜,在群里看博友们聊天说怎么避免被刷CDN流量有一个就是多吉云可以设置流量限额和单IP访问每秒访问次数限制,当晚看到我就给我多吉去设置了一下,然后QPS限制就设置了个60,本来以为刷新一次页面就占用1次,我想着60次怎么着也够了,结果还真就出问题了。 然后就去多吉改了下这个QPS,改成了200,等两分钟生效,清空浏览器缓存,重新访问,评论小表情全部加载出来,完美!最后发现这个套CDN乱七八糟的设置太多了,一不小心哪个设置就影响站点访问,设置不好不但起不到加速的作用,还会适得其反添加上恋爱计时工具引发的问题上面那个CDN的问题对整个站点页面没什么影响,,,,,,,这个添加工具这个可给我折磨的不轻,,就在12月22日添加完这个恋爱计时小工具,,我就发现我的整个博客首次访问加载巨慢,首次访问的时候上面那个缓冲条就一直在加载,有的时候能加载十几秒,慢的甚至20秒缓冲条才加载完成,其实页面是已经能出来,就是浏览器的加载条一直显示在加载。结合上面那个问题几乎前后时间出现,我就也以为是套了CDN的问题,难道又是CDN哪里设置的不对,适得其反了,我就找了台主机重新搭建了typecho+Joe主题,刚搭建好访问一点问题没有,想着那也不应该是主题CSS加载问题啊,然后又对比着后台在新搭建的站点主题设置上面一条一条设置好,设置好之后就出现了一模一样的情况,开始出现加载慢的问题,新建的也没套CDN啊,让我更摸不着头脑了。访问的时候F12一下,有时候会提示一个HarmonyOS_Sans_SC_Medium.subset.woff2这个字体加载缓慢,我就把整个站点数据拷贝下载,用notpad工具搜了下所有的文件,没有这个文件,也没有在哪引用这个字体,奇怪了。这一两个月完善博客,改了很多微小的地方,其中有一个涉及到改程序文件的就有这个添加恋爱计时小工具,我把这块代码删除掉,嘿,还真就好了,顿时一股豁然开朗的感觉,真他喵的折磨死我了,然后我又一行一行看了下加的这些代码,都是一些定义样式文件,唯一有一个引用了jsdelivr的外链css,我就访问了下这个css外链,还真找到了这个家伙,原来这个字体文件在这引用的,而且是jsdelivr的字体链接,怪不的加载那么慢。 把添加的这一行 <link rel="stylesheet" type="text/css" href="https://gcore.jsdelivr.net/gh/xiaoyanu/
[email protected]
/more/lovetime.css" /> 给删除后就恢复了,删除之后对显示的计时小工具没有任何影响,不知道干啥的,纯纯是给人挖坑。最后看了下加载出来的字体样式明显不一样了
2024年01月20日
328 阅读
10 评论
0 点赞
2024-01-20
换了个新的ICO图标
上个月发现了AIDesign这个平台,今天就玩了一下想换下图标,本来ICO是个小国旗,也是挺有范的,哈哈,为了避免出现一些不可预料的事情,这种还是不乱用了,就用这个平台AI生成了一个,输入名称或者关键词直接就可以生成很多个人或者商用免费的LOGO图标,也是翻了好几页才看到这个还挺不错的,就把博客的ICO图标和我的Gravatar头像都换成了这个,也是感觉比原来的头像更加有辨识度了,Hary的H,我的姓韩的H,正好这个H挺符合我用,哈哈。 本来生成好是这样的 我给裁剪了一下只要其中的H图标效果就是这样的,还是蛮不错的。
2024年01月20日
233 阅读
6 评论
0 点赞
2024-01-02
时隔ICP备案半个月,又完成了网安备案
上个月15号完成了这个hary.cc的ICP备案,之前一直都没好好管理网站,我是在2018年的时候就完成了第一次ICP备案,现在ICP备案号都干到8了,也没想着整个网安备案,之前也确实没关注这块,上个月才想起来好好重新整理下我的博客站,更换了这个新注册10年的域名,换了图床存储到又拍云,套上了多吉云的CDN,( 主打一个白嫖,暂时免费额度也都够用的 ),最近逛博客圈的很多博客站,看到很多站点下面都挂的不止有ICP备案号,大部分也都有网安备案号,才发现现在个人网站也都进行了网安备案,我也就想着,反正也是折腾,那就顺手再来个网安备案吧,虽然现在是不强制个人网站的网安备案,但是看着很多站点也都备案了,反正自己用的服务器,域名这些也都是国内的服务,合法公民,遵守国家规定。 备案过程: 1、我是在12月25号晚上提交上去的,提交看到说是需要大概30个工作日,到今天才刚好一周就给我审批完了,中间还有三天的元旦假期,这效率跟ICP备案也差不多,也还不错,没有让等上个十几天。2、备案之前我在网上也搜了很多相关的帖子看了下,不知道是不是最近网安备案系统升级了还是区域的原因,我实际经历的和网上说的很多东西都不一样,都说个人网站不能备案交互式的,大概率审批不通过,还有就是不能有评论功能,我还看到有的申请的非交互式的开了评论又被通知更改交互式的,想着不就大不了申请被拒绝嘛,所以我就直接申请了交互式的。3、申请的时候填写信息就按照各大云厂商的网安备案文档说明填写一些个人信息、域名信息和网站信息,有一点我发现所有的在网上找的帖子都不一样,就是选择交互式或者非交互式的地方,网上都是说选择非交互式的,然后选择WWW服务比较容易通过,我实际在操作的时候,选择非交互式下面什么选项都没有,直接就下一个信息了,而选择交互式则由跟多网站类型让选择,具体看下这个截图 按照后面的描述说明,我觉得也就这一个用户内容咨询类最适合个人博客的网站定位了,由于在网上没有找到具体申请交互式的教程,也不知道选择这个合不合适,也是忐忑了一星期,也就今天上午,2024年第一天上班,上午就接到了网安大队的网警同志打来电话,问我是不是申请了个网站,我说是的,他说没啥问题,我等下就给你审批通过了,然后过一会就收到审批通过的短信了,也没有网上说的申请交互式要线下去网警大队当面审批。4、每次进去网安备案网站,首页就有这个系统升级的公告,在10月份的时候系统升级了,我遇到的不一样的选项不知道是不是这次升级之后就变化的了。 最后 展示下我的备案号... 现在国家的各个系统也都在完善,网安系统也慢慢像ICP备案那样方便,反正现在能备案就先备个案吧,省的以后万一哪天强制要必须网安备案了再申请就不一定好审批通过了。还有一个和ICP备案不一样的就是申请的时候是归属地审批,不像ICP个人备案是户籍地审批的( 我绝对不会说我最先是申请了户籍地被拒绝了... )
2024年01月02日
665 阅读
21 评论
0 点赞
2023-12-22
给网站添加上恋爱计时小工具-完美适配Joe主题
恋爱倒计时小工具使用Javascript来计时⏲给自己的网站侧边栏位置添加上一个计时小工具,在丰富网站内容的同时又使网站显得很浪漫。原来搭建的有一个基于Typecho情侣主题Brave的站点,里面的点点滴滴和Love List内容很久都没更新了,好像也就一个计时有点用,想着就直接在这个博客站侧栏单独添加一个计时的功能,然后就搜了一下,还挺多博主有记录关于添加恋爱计时功能的。找了一下也没有拿来就能用的(因为自己不会写哈),最后在小言u博客找到了关于这块的代码,然后做了细微修改,完美适配现在用的Joe主题,然后就写个文章分享下吧,也记录下折腾修改的内容,时间长了自己都不记得修改的哪了。效果图: 代码在最下面。。。Joe主题添加方法:PC端:如果你跟我用的一样是Joe主题,直接将PC段代码复制粘贴到自定义侧边栏内即可,用的其他主题的话就自行发挥吧。。。 PC端代码: <ul class="joe_header__slideout-count"> <style> /* 头像大小调整 */ .pctouxiang{ width: 66px; /* 头像宽度 */ height: 66px; /* 头像高度 */ vertical-align: -20px; border-radius: 50%; margin-right: 5px; margin-bottom: 5px; -webkit-box-shadow: 1px 1px 1px rgba(0,0,0,.1), 1px 1px 1px rgba(0,0,0,0.1), 1px 1px 1px rgba(0,0,0,0.1); box-shadow: 1px 1px 1px rgba(0,0,0,.1), 1px 1px 1px rgba(0,0,0,0.1), 1px 1px 1px rgba(0,0,0,0.1); border: 2px solid #fff; } </style> <body> <div style="text-align: center;"> <!-- 头像1 --> <img class="pctouxiang" src="https://img.hary.cc/pan/2023/12-b3d51adb737efd61.jpeg"> <svg class="my-face" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" width="50" height="50"><path d="M866.944 256.768c-95.488-95.488-250.496-95.488-345.984 0l-13.312 13.312-9.472-9.472c-93.824-93.824-246.656-100.736-343.68-10.368-101.888 94.976-104.064 254.592-6.4 352.256l13.568 13.568 299.264 299.264c25.728 25.728 67.584 25.728 93.44 0l312.576-312.576c95.488-95.488 95.488-250.368 0-345.984zM335.36 352.64c-20.48 0-40.832 6.016-56.704 18.944a85.4912 85.4912 0 0 0-6.912 126.976c9.984 9.984 9.984 26.24 0 36.224l-3.2 3.2c-8.192 8.192-21.632 8.192-29.952 0-52.608-52.608-57.216-138.496-6.528-192.896 26.112-28.032 61.952-43.52 100.096-43.52 14.08 0 25.6 11.52 25.6 25.6v3.072c0 12.416-9.984 22.4-22.4 22.4z" p-id="21617" data-spm-anchor-id="a313x.7781069.0.i46" class="selected" fill="#FF2727"></path></svg> <!-- 头像2 --> <img class="pctouxiang" src="https://img.hary.cc/pan/2023/12-b93dfe55e6f079f2.jpeg"><br> <span id="pctimejishiqi"></span> </div> <script> function timingTime(){ // 开始时间 格式: 年-月-日 时:分:秒 // 例如:2021-8-14 00:00:00 let start = '2022-2-7 09:15:00' let startTime = new Date(start).getTime() let currentTime = new Date().getTime() let difference = currentTime - startTime let m = Math.floor(difference / (1000)) let mm = m % 60 // 秒 let f = Math.floor(m / 60) let ff = f % 60 // 分钟 let s = Math.floor(f/ 60) // 小时 let ss = s % 24 let day = Math.floor(s / 24 ) // 天数 return "已经在一起" + "<br> " + day + " 天 " + ss + " 小时 " + ff + " 分钟 " + mm +' 秒' } setInterval(()=>{ document.getElementById('pctimejishiqi').innerHTML = timingTime() },1000) </script></body> </ul>手机端:找到/usr/themes/Joe/public文件夹下的header.php文件,打开编辑我是在累计收到X条评论下方添加的,大概就在324行,具体效果图可以手机访问看下我的站点的侧边栏效果,也可以在头像下面或者最后添加,把代码放到你想要显示的位置就可以了。 手机端代码: <!--PE侧边栏恋爱计时begin--> <ul class="joe_header__slideout-count"> <style> /* 头像大小调整 */ .petouxiang{ width: 66px; /* 头像宽度 */ height: 66px; /* 头像高度 */ vertical-align: -20px; border-radius: 50%; margin-right: 5px; margin-bottom: 5px; -webkit-box-shadow: 1px 1px 1px rgba(0,0,0,.1), 1px 1px 1px rgba(0,0,0,0.1), 1px 1px 1px rgba(0,0,0,0.1); box-shadow: 1px 1px 1px rgba(0,0,0,.1), 1px 1px 1px rgba(0,0,0,0.1), 1px 1px 1px rgba(0,0,0,0.1); border: 2px solid #fff; } </style> <body> <div style="text-align: center;"> <!-- 头像1 --> <img class="petouxiang" src="https://img.hary.cc/pan/2023/12-b3d51adb737efd61.jpeg"> <svg class="my-face" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" width="50" height="50"><path d="M866.944 256.768c-95.488-95.488-250.496-95.488-345.984 0l-13.312 13.312-9.472-9.472c-93.824-93.824-246.656-100.736-343.68-10.368-101.888 94.976-104.064 254.592-6.4 352.256l13.568 13.568 299.264 299.264c25.728 25.728 67.584 25.728 93.44 0l312.576-312.576c95.488-95.488 95.488-250.368 0-345.984zM335.36 352.64c-20.48 0-40.832 6.016-56.704 18.944a85.4912 85.4912 0 0 0-6.912 126.976c9.984 9.984 9.984 26.24 0 36.224l-3.2 3.2c-8.192 8.192-21.632 8.192-29.952 0-52.608-52.608-57.216-138.496-6.528-192.896 26.112-28.032 61.952-43.52 100.096-43.52 14.08 0 25.6 11.52 25.6 25.6v3.072c0 12.416-9.984 22.4-22.4 22.4z" p-id="21617" data-spm-anchor-id="a313x.7781069.0.i46" class="selected" fill="#FF2727"></path></svg> <!-- 头像2 --> <img class="petouxiang" src="https://img.hary.cc/pan/2023/12-b93dfe55e6f079f2.jpeg"><br> <span id="petimejishiqi"></span> </div> <script> function timingTime(){ // 开始时间 格式: 年-月-日 时:分:秒 // 例如:2021-8-14 00:00:00 let start = '2022-2-7 09:15:00' let startTime = new Date(start).getTime() let currentTime = new Date().getTime() let difference = currentTime - startTime let m = Math.floor(difference / (1000)) let mm = m % 60 // 秒 let f = Math.floor(m / 60) let ff = f % 60 // 分钟 let s = Math.floor(f/ 60) // 小时 let ss = s % 24 let day = Math.floor(s / 24 ) // 天数 return "已经在一起" + "<br> " + day + " 天 " + ss + " 小时 " + ff + " 分钟 " + mm +' 秒' } setInterval(()=>{ document.getElementById('petimejishiqi').innerHTML = timingTime() },1000) </script></body> </ul> <!--PE侧边栏恋爱计时end-->
2023年12月22日
256 阅读
4 评论
0 点赞
1
2
...
4