博客主页 🍚
分类

Typecho

下的文章

Count:

计 15 篇
537
typecho文章编辑页面,增加图床上传按钮
2021-06-11
分类: 📝Typecho
简介:虽然本站使用七牛的图床,但是小图什么的流量也吃不消,所以第三方的免费图床就显得很必要了,一个火了很久的路过图床,还有后起之秀的遇见图床。二者虽然都是算是国内很经典的图床了(本喵认为),但是如何方便的引用就显得很重要了。今天参考了一篇文章,很方便,分享出来~路过图床 高速稳定的图片上传和外链服务,全球CDN加速, 最大单张支持 10 MB, 支持批量上传,目前已经稳定运行10年。路过图床提供论坛图片上传插件,但是并不支持typecho,通过稍微修改代码,即可实现typecho编辑文章时上传图片功能,并显示到编辑框内。 - 隐藏 - typecho后台,admin/footer.php,放入/body前。也可以放入edit post和edit page页面,只在此显示。但是本喵根据本JOE实验了一下,实际上是在修改/admin/editor js.php,write page.php,write post.php这三个文件。另外,可以讲代码的链接换成https://www.hualigs.cn/simple,即可改为遇见图床。但是我没找到适合两个图床共存的方法,或者有没有更好的图床推荐给本喵啊(sm.ms就算啦~)效果图就是这样
619
无标签
为typecho添加一个随记(日记,心情,微博)页面
2021-05-20
分类: 📝Typecho
简介:新做了一个写日记的模板,根据大佬 安和 的方法做出来的,以后可以随时随地写小日记啦!独立页面首先创建个独立页面模板,名字其实随便的,这里我创建的是 diary.php然后依旧是惯例的模板开头<?php /** * 日记 * * @package custom * */ if (!defined('__TYPECHO_ROOT_DIR__')) exit;?>创建完页面之后依旧是把主题的page页面复制过来这个我就不演示了,大家自行复制就好但要注意,要删除掉主题的content输出部分(其实可以保留,看各位自己)评论所谓日记页面就是在单独创建个独立页面,只有你可以在底下评论,因为我这边是个人博客,没有其他用户的,所以就直接弄登录了就显示评论框即可<?php if($this >user >hasLogin()):?>注意,这个地方不是加在diary.php的,你需要单独创建一个评论文件,复制一个原先的评论文件就可以,起名成comments diary.php就行,然后在评论框位置(邮箱名称那里)的上面加上haslogin,然后最后以一个<?php endif; ?>结束,但是评论样式总不能跟普通评论一样吧(如果不嫌弃其实也可以)你可以重新写一个评论样式或者用你给主题首页添加的说说样式(上文)如若大家都懒得写,可以评论告诉我,我可以把我在nexmoe写的那个贴上来hhh现在本喵又发现了一种新的方法,直接做好的模板(仅试验适配joe主题),可以去 这里 下载查看
364
使Typecho实现PJAX无刷新访问
2020-01-26
分类: 📝Typecho
简介:使Typecho实现PJAX无刷新访问因为新建了一个typecho博客,界面很干净简洁,加载速度也异常迅速。因此打算在左侧侧边栏创建一个网易云音乐的音乐外链,但是并没有全站无刷新。因此百度了一下,解决了问题。下面是解决方法,具体效果欢迎访问吃糖博客 【地址现已失效】在服务器中新建pjax.js文件,用于操作 PJAX 组件。内容暂时留空。打开网站的footer.php文件, 在文件底部</body>的前面添加下面代码:<script src="https://cdn.jsdelivr.net/npm/pjax/pjax.js"></script> <script src="https://tuziang.com/usr/themes/Fantasy/static/pjax.js"></script>其中第二行需要替换成你自己的路径。现在开始填写刚才新建的pjax.js文件:var pjax = new Pjax({ // 在页面进行 PJAX 时需要被替换的元素或容器,一条一个 CSS 选择器,数组形式 selectors: [ "title", "meta[name=description]", "main" ], cacheBust: false }) selectors中是每次刷新都要改变的元素。动画一使用nprogress的加载动画: http://ricostacruz.com/nprogress/同样在footer.php底部添加两行代码<script src="https://unpkg.com/nprogress@0.2.0/nprogress.js"></script> <link href="https://unpkg.com/nprogress@0.2.0/nprogress.css" rel="stylesheet" type="text/css"> 接着修改刚才我们自己新建的pjax.js文件,在文件底部添加下面两个函数document.addEventListener('pjax:send', function (){ NProgress.start(); }); document.addEventListener('pjax:complete', function (){ NProgress.done(); ; });动画二这个动画来自于https://blog.dyboy.cn/program/56.html利用Pjax实现网页无刷新加载的详细方法 DYBOY 专注程序开发与信息安全在header.php文件中的</body>前面添加这行代码: <! pjax 动画 > <div class="loading"> <div id="loader"></div></div>接着去css文件中,添加:/*pjax 动画*/ .loading{display:none} .loading{height:100%;width:100%;position:fixed;top:0;left:0;z index:999999;background color:rgba(250,250,250,.9)} .loading img{width: 280px;height:210px;position: relative;top: 45%;left: 50%;margin left: 140px;margin top: 105px;} #loader{display: block; position: relative; left: 50%; top: 50%; width: 150px; height: 150px; margin: 75px 0 0 75px; border radius: 50%; border: 3px solid transparent; border top color: #ff5a5a; webkit animation: spin 1s linear infinite; animation: spin 1s linear infinite;} #loader:before{content: ""; position: absolute; top: 5px; left: 5px; right: 5px; bottom: 5px; border radius: 50%; border: 3px solid transparent; border top color: #5af33f; webkit animation: spin 3s linear infinite; animation: spin 3s linear infinite;} #loader:after{content: ""; position: absolute; top: 15px; left: 15px; right: 15px; bottom: 15px; border radius: 50%; border: 3px solid transparent; border top color: #6dc9ff; webkit animation: spin 2s linear infinite; animation: spin 2s linear infinite;} @ webkit keyframes spin{0%{ webkit transform: rotate(0deg); ms transform: rotate(0deg); transform: rotate(0deg);} 100%{ webkit transform: rotate(360deg); ms transform: rotate(360deg); transform: rotate(360deg);}} @keyframes spin{0%{ webkit transform: rotate(0deg); ms transform: rotate(0deg); transform: rotate(0deg);} 100%{ webkit transform: rotate(360deg); ms transform: rotate(360deg); transform: rotate(360deg);}} 最后修改刚才我们自己新建的pjax.js文件:document.addEventListener('pjax:send', function (){ $(".loading").css("display", "block"); }); document.addEventListener('pjax:complete', function (){ $(".loading").css("display", "none"); });我用的就是第一种动画效果。
博客主页 火喵博客・日记本 经为流逝的日月,纬为人们的生业 51统计 百度统计 🌸
萌ICP备20210005号 辽ICP备2021005644号-1 辽公网安备 21021102000984号 十年之约 2 年 326 天 12 小时 14 分 🌸 本站由 Typecho 建站,并搭配自制 MyDiary 主题 Copyright © 2009 ~ 2023. 火喵酱 All rights reserved.
历史足迹
分类目录
  • 日常
  • 晒物
  • 🦙 代码
  • 🏗️ 建站
  • 📷 生活
  • 打赏图
    打赏博主
    欢迎
    欢迎
    欢迎访问火喵博客・日记本
    欢迎来看望喵喵!