20241127 给typecho文章编辑附件 添加视频 图片预览
Typecho在写文章时,如果一次性上传太多张图片可能分不清哪张,因为附件没有略缩图,无法实时阅览图片,给文章插入图片时很不方便。
编辑admin/file-upload.php
大约十八行的位置
一个while 循环里面,这是在进行html元素更新操作,在合适的位置插入视频或者图片标签即可.
最终成为这样
<?php while ($attachment->next()): ?><li data-cid="<?php $attachment->cid(); ?>" data-url="<?php echo $attachment->attachment->url; ?>" data-image="<?php echo $attachment->attachment->isImage ? 1 : 0; ?>"><input type="hidden" name="attachment[]" value="<?php $attachment->cid(); ?>" /><!-- 视频,图片预览 --><?php if($attachment->attachment->isImage==1): ?><img src="<?php echo $attachment->attachment->url; ?>" width="80%"></src><br/><?php endif; ?><?php if ($attachment->attachment->mime == "video/mp4"): ?><video src="<?php echo $attachment->attachment->url; ?>" width="100%" controls="true"></video><br/><?php endif; ?><a class="insert" title="<?php _e('点击插入文件'); ?>" href="###"><?php $attachment->title(); ?></a><div class="info"><?php echo number_format(ceil($attachment->attachment->size / 1024)); ?> Kb<a class="file" target="_blank" href="<?php $options->adminUrl('media.php?cid=' . $attachment->cid); ?>" title="<?php _e('编辑'); ?>"><i class="i-edit"></i></a><a href="###" class="delete" title="<?php _e('删除'); ?>"><i class="i-delete"></i></a></div></li>
<?php endwhile; ?>
当然仅仅是这里还不够,还有admin/file-upload-js.php需要修改,原理差不多
大约103行,额外追加一点代码
function fileUploadComplete (id, url, data) {let media = ''if(data.type==="png"){media=' <img src='+data.url+' width="80%"></src><br/>'}else if(data.type==="mp4"){media=' <video src='+data.url+' width="80%" controls="true"></video><br/>'}var li = $('#' + id).removeClass('loading').data('cid', data.cid).data('url', data.url).data('image', data.isImage).html('<input type="hidden" name="attachment[]" value="' + data.cid + '" />'+ media+ '<a class="insert" target="_blank" href="###" title="<?php _e('点击插入文件'); ?>">' + data.title + '</a><div class="info">' + data.bytes+ ' <a class="file" target="_blank" href="<?php $options->adminUrl('media.php'); ?>?cid=' + data.cid + '" title="<?php _e('编辑'); ?>"><i class="i-edit"></i></a>'+ ' <a class="delete" href="###" title="<?php _e('删除'); ?>"><i class="i-delete"></i></a></div>').effect('highlight', 1000);attachInsertEvent(li);attachDeleteEvent(li);updateAttacmentNumber();if (!completeFile) {completeFile = data;}
}
相关文章:
20241127 给typecho文章编辑附件 添加视频 图片预览
Typecho在写文章时,如果一次性上传太多张图片可能分不清哪张,因为附件没有略缩图,无法实时阅览图片,给文章插入图片时很不方便。 编辑admin/file-upload.php 大约十八行的位置 一个while 循环里面,这是在进行html元素更新操作,在合…...
vue3使用monaco编辑器(VSCode网页版)
vue3使用monaco编辑器(VSCode网页版) 文章说明参考文章核心代码效果展示实践说明源码下载 文章说明 一直在找网页版的编辑器,网页版的VSCode功能很强大,这个monaco就是VSCode样式的编辑器,功能很强大,可以直…...
Spark优化--开发调优、资源调优、数据倾斜调优和shuffle调优等
针对Spark优化,我们可以从多个角度进行,包括开发调优、资源调优、数据倾斜调优和shuffle调优等。以下是一些具体的优化方法: 1. 开发调优 避免创建重复的RDD:对于同一份数据,只应该创建一个RDD,避免创建多…...
Day1 生信新手笔记
生信新手笔记 生信学习第一天笔记打卡。 转录组学中: 上游分析-基于linux,包括质控、过滤、比对、定量; 下游分析-基于R语言,包括差异分析、富集分析、可视化。 1. 级别标题 一个井号加空格 就是一级标题,两个井号加…...
Python的秘密基地--[章节2]Python核心数据结构
第2章:Python核心数据结构 Python中的数据结构提供了强大的工具来存储和操作数据。理解这些数据结构是Python编程的基础。 2.1 列表(List) 2.1.1 什么是列表 列表是一种有序的可变序列,用于存储一组数据。它支持多种类型的数据…...
【Electron学习笔记(三)】Electron的主进程和渲染进程
Electron的主进程和渲染进程 Electron的主进程和渲染进程前言正文1、主进程2、渲染进程3、Preload 脚本3.1 在项目目录下创建 preload.js 文件3.2 在 main.js 文件下创建路径变量并将 preload.js 定义为桥梁3.3 在 preload.js 文件下使用 electron 提供的contextBridge 模块3.4…...
[免费]SpringBoot+Vue景区订票(购票)系统【论文+源码+SQL脚本】
大家好,我是java1234_小锋老师,看到一个不错的SpringBootVue大景区订票(购票)系统,分享下哈。 项目视频演示 【免费】SpringBootVue景区订票(购票)系统 Java毕业设计_哔哩哔哩_bilibili 项目介绍 现代经济快节奏发展以及不断完善升级的信息…...
idea_工程与模块管理
module相关操作 项目结构新建module移除模块删除模块导入模块 项目结构 层级关系 project(工程) - module(模块) - package(包) - class(类) 在 IntelliJ IDEA 中Project是最顶级的结构单元 ,然后就是Module。目前,主流的大型项目结构基本都是多Module…...
A02、Java 设计模式优化
1、单例模式 1.1、什么是单例模式 它的核心在于,单例模式可以保证一个类仅创建一个实例,并提供一个访问它的全局访问点。该模式有三个基本要点:一是这个类只能有一个实例;二是它必须自行创建这个实例;三是它必须自行向…...
jdk8没有Buffer.put()
在Java中,Buffer是一个抽象类,它定义了缓冲区的通用行为。不过,Buffer本身并没有直接提供put()方法。put()方法是在Buffer的子类中定义的,比如ByteBuffer、CharBuffer、ShortBuffer、IntBuffer、LongBuffer、FloatBuffer和DoubleB…...
Artec Leo:航海设备维护的便携式3D扫描利器【沪敖3D】
挑战:海军服务提供商USP Maritime需要CAD数据来执行维修和改装任务,特别是在偏远地区的任务,以及原始设计丢失的情况下。 解决方案:Artec Leo, Artec Studio, Autodesk Inventor 效果:高精度船舶组件和船坞机械模型&…...
HCIA笔记6--路由基础
0. 概念 自治系统:一个统一管理的大型网络,由路由器组成的集合。 路由器隔离广播域,交换机隔离冲突域。 1.路由器工作原理 路由器根据路由表进行转发数据包; 路由表中没有路由,直接丢弃该数据包路由表中只有一条路…...
说说Elasticsearch拼写纠错是如何实现的?
大家好,我是锋哥。今天分享关于【说说Elasticsearch拼写纠错是如何实现的?】面试题。希望对大家有帮助; 说说Elasticsearch拼写纠错是如何实现的? 1000道 互联网大厂Java工程师 精选面试题-Java资源分享网 在 Elasticsearch 中&…...
Ubuntu20.04运行R-VIO2
目录 1.环境配置2.构建项目3. 运行 VIO 模式4.结果图 1.环境配置 CMakeLists.txt中 C 使用 14、opencv使用4 2.构建项目 克隆代码库: 在终端中执行以下命令克隆项目:git clone https://github.com/rpng/R-VIO2.git编译项目: 使用 catkin_m…...
【软件项目测试文档大全】软件测试方案,验收测试计划,验收测试报告,测试用例,集成测试,测试规程和指南,等保测试(Word原件)
1. 引言 1.1. 编写目的 1.2. 项目背景 1.3. 读者对象 1.4. 参考资料 1.5. 术语与缩略语 2. 测试策略 2.1. 测试完成标准 2.2. 测试类型 2.2.1. 功能测试 2.2.2. 性能测试 2.2.3. 安全性与访问控制测试 2.3. 测试工具 3. 测试技术 4. 测试资源 4.1. 人员安排 4.…...
Kubernetes集群操作
查看集群信息: kubectl get nodes 删除节点 (⽆效且显示的也可以删除) 后期如果 要删除某个节点,为了不增加其他节点的访问压力,先增加一个节点,再删除要删除的节点 语法 :kubect delete…...
分布式事务调研
目录 需求背景: 本地事务 分布式基本理论 1、CAP 定理 2、BASE理论 分布式事务方案 #2PC #1. 运行过程 #1.1 准备阶段 #1.2 提交阶段 #2. 存在的问题 #2.1 同步阻塞 #2.2 单点问题 #2.3 数据不一致 #2.4 太过保守 3PC #本地消息表 TCC TCC原理 …...
Webpack 的构建流程
Webpack 的构建流程可以概括为以下几个步骤: 1. 初始化: Webpack 读取配置文件(webpack.config.js),合并默认配置和命令行参数,初始化Compiler对象。 2. 构建依赖图: 从入口文件开始递归地分…...
Cesium 当前位置矩阵的获取
Cesium 位置矩阵的获取 在 3D 图形和地理信息系统(GIS)中,位置矩阵是将地理坐标(如经纬度)转换为世界坐标系的一种重要工具。Cesium 是一个强大的开源 JavaScript 库,用于创建 3D 地球和地图应用。在 Cesi…...
ubuntu24.04 python环境
ubuntu24.04 python环境 0.引言1.使用整理 0.引言 新系统安装依赖库时报错: pip3installrequirements.txterror:externally−managed−environmentThisenvironmentisexternallymanaged╰–>ToinstallPythonpackagessystem−wide,tryaptinstallpython3−xyz,whe…...
YOLO系列论文综述(从YOLOv1到YOLOv11)【第9篇:YOLOv7——跨尺度特征融合】
YOLOv7 1 摘要2 网络架构3 改进点4 和YOLOv4及YOLOR的对比 YOLO系列博文: 【第1篇:概述物体检测算法发展史、YOLO应用领域、评价指标和NMS】【第2篇:YOLO系列论文、代码和主要优缺点汇总】【第3篇:YOLOv1——YOLO的开山之作】【第…...
Elasticearch索引mapping写入、查看、修改
作者:京东物流 陈晓娟 一、ES Elasticsearch是一个流行的开源搜索引擎,它可以将大量数据快速存储和检索。Elasticsearch还提供了强大的实时分析和聚合查询功能,数据模式更加灵活。它不需要预先定义固定的数据结构,可以随时添加或修…...
【大模型微调】一些观点的总结和记录
垂直领域大部分不用保持通用能力的,没必要跟淘宝客服聊天气预报,但是主要还是领导让你保持 微调方法没有大变数了,只能在数据上下功夫,我能想到的只有提高微调数据质量。 sft微调的越多,遗忘的越多. 不过对于小任务,rank比较低(例如8,16)的任务,影响还是有有限的。一…...
Vue 3 Hooks 教程
Vue 3 Hooks 教程 1. 什么是 Hooks? 在 Vue 3 中,Hooks 是一种组织和复用组件逻辑的强大方式。它们允许您将组件的状态逻辑提取到可重用的函数中,从而简化代码并提高代码的可维护性。 2. 基本 Hooks 介绍 2.1 ref 和 reactive 这两个函数…...
pandas数据处理及其数据可视化的全流程
Pandas数据处理及其可视化的全流程是一个复杂且多步骤的过程,涉及数据的导入、清洗、转换、分析、可视化等多个环节。以下是一个详细的指南,涵盖了从数据准备到最终的可视化展示的全过程。请注意,这个指南将超过4000字,因此请耐心…...
docker 在ubuntu系统安装,以及常用命令,配置阿里云镜像仓库,搭建本地仓库等
1.docker安装 1.1 先检查ubuntu系统有没有安装过docker 使用 docker -v 命令 如果有请先卸载旧版本,如果没有直接安装命令如下: 1.1.0 首先,确保你的系统包是最新的: 如果是root 权限下面命令的sudo可以去掉 sudo apt-get upda…...
torch.maximum函数介绍
torch.maximum 函数介绍 定义:torch.maximum(input, other) 返回两个张量的逐元素最大值。 输入参数: input: 张量,表示第一个输入。other: 张量或标量,表示第二个输入。若为张量,其形状需要能与 input 广播。输出&a…...
Java面试之多线程并发篇(9)
前言 本来想着给自己放松一下,刷刷博客,突然被几道面试题难倒!引用类型有哪些?有什么区别?说说你对JMM内存模型的理解?为什么需要JMM?多线程有什么用?似乎有点模糊了,那…...
Java全栈:超市购物系统实现
项目介绍 本文将介绍如何使用Java全栈技术开发一个简单的超市购物系统。该系统包含以下主要功能: 商品管理用户管理购物车订单处理库存管理技术栈 后端 Spring Boot 2.7.0Spring SecurityMyBatis PlusMySQL 8.0Redis前端 Vue.js 3Element PlusAxiosVuex系统架构 整体架构 …...
1.1 数据结构的基本概念
1.1.1 基本概念和术语 一、数据、数据对象、数据元素和数据项的概念和关系 数据:是客观事物的符号表示,是所有能输入到计算机中并被计算机程序处理的符号的总称。 数据是计算机程序加工的原料。 数据对象:是具有相同性质的数据元素的集合&…...
双十一网站怎么做/企业建站系统
一周前看的忘记写了,之前用jgit感觉有点头大,所以了解了一下,jgit里面有tree-walker啊这种东西,不了解git的底层就不能明白到底啥意思 git事实上是一个k-v store 里面存几种object commit object tree object blob object tree ob…...
自己网站如何做关键词/外贸定制网站建设电话
在常见的业务,应该会遇到实时多边形的绘制,这也算最基本的业务,绘制多边形容易,如何保证其形状正确还是需要注意的,多边形的绘制为了保证图形本身正确,需要进行剖分,剖分算法earcut最为常用&…...
用什么做网站/陕西新站seo
MSQ是一种统计学方法,用于评估调查问卷的信度和效度。信度指的是调查问卷在不同时间或者不同环境下的一致性,效度指的是调查问卷对于衡量目标变量的准确性和有效性。 通常,在使用MSQ之前,需要设计问卷,并收集一定数量的…...
个人经营网站 办理/网站外包公司有哪些
yum puppet 并整合控制台 上篇说了下在ubuntu12.04上安装puppet,安装的版本为puppet2.7.11版本,今天尝试了下在CentOS6.4系统上安装puppet 3.1.1版本,本文参考chenshake的文章 http://www.cactifans.org/linux/994.html 【原文链接,尊重别人的劳动成功】…...
asp在网站开发中的作用/青岛seo优化
发现空间是足够的,然后df -i 查看了下inodes,发现根目录下的inodes值使用率为63%了。 查看到底哪个目录下面的文件最多,查看前30个目录最多文件即可。 find / -xdev -printf %h\n | sort | uniq -c | sort -nr -k 1 | head -30 经查…...
大型网站建设公司 北京/广告接单网站
该楼层疑似违规已被系统折叠 隐藏此楼查看此楼n2;//换方下子}else{chess[i][j]2;setfillcolor(BLACK); setfillstyle(BLACK);fillellipse(m.x-7,m.y-7,m.x7,m.y7);if(Game_Over1(chess,2)1||Game_Over2(chess,2)1||Game_Over3(chess,2)1) {setcolor(BLACK);outtextxy(200,200,&…...