您现在的位置是:首页 > cms教程 > PbootCMS教程PbootCMS教程
pbootcms上传格式和支持webp图片的修改方法
听寒2023-01-25PbootCMS教程已有人查阅
导读当pbootcms遇到需要修改文件上传格式的时候,先去/config/config.php修改上传配置信息,一般情况下在这里修改就可以了。打开/config/config.php修改upload配置信息,增加webp格式

这里我们以图片格式为例进行介绍,本文的栗子上台→webp格式图片。
什么是 WebP 格式的图像?
WebP 是谷歌在 2010 年发布的一种新的图像格式,支持无损和有损压缩。在无损压缩下,同等质量的 WebP 图片比 PNG 小 26%,在有损压缩下,同等质量的 WebP 图片比 JPEG 小 25-34%。 WebP 在不降低图像质量的情况下将尺寸减小了大约三分之一。详情请参考谷歌官网。
修改步骤
1、打开/config/config.php修改upload配置信息,增加webp格式
//上传配置'upload'=>array('format'=>'jpg,jpeg,png,gif,xls,xlsx,doc,docx,ppt,pptx,rar,zip,pdf,txt,mp4,avi,flv,rmvb,mp3,otf,ttf,webp','max_width'=>'1920','max_height'=>''),
一般到此就结束的,然而测试发现提示:“选择的图片种包含不支持的格式”,这里是因为layui本身也有图片格式限制导致。

2、打开appsadminviewdefaultlayuilayui.all.js,搜索jpg|png|gif|bmp|jpeg,在尾巴增加webp,保存。
原来
jpg|png|gif|bmp|jpeg
修改成
jpg|png|gif|bmp|jpeg|webp

3、操作完前面后台强制刷新后,上传就正常了,然后发现编辑里还不行,那是因为ueditor也有限制,接着操作。
打开coreextendueditorphpconfig.json,在图片相关的配置代码后面都增加webp,下面是修改后的全部代码,替换或者对照修改后保存,强制刷新后台页面。
为避免以下代码某些字符被处理,提供个config.json文件。
/* 前后端通信相关的配置,注释只允许使用多行方式 */
{
/* 上传图片配置项 */
"imageActionName": "uploadimage", /* 执行上传图片的action名称 */
"imageFieldName": "upfile", /* 提交的图片表单名称 */
"imageMaxSize": 20480000, /* 上传大小限制,单位B */
"imageAllowFiles": [".png", ".jpg", ".jpeg", ".gif", ".bmp", ".webp"], /* 上传图片格式显示 */
"imageCompressEnable": false, /* 是否压缩图片,默认是true */
"imageCompressBorder": 1600, /* 图片压缩最长边限制 */
"imageInsertAlign": "none", /* 插入的图片浮动方式 */
"imageUrlPrefix": "", /* 图片访问路径前缀 */
"imagePathFormat": "/upload/image/{yyyy}{mm}{dd}/{time}{rand:6}", /* 上传保存路径,可以自定义保存路径和文件名格式 */
/* {filename} 会替换成原文件名,配置这项需要注意中文乱码问题 */
/* {rand:6} 会替换成随机数,后面的数字是随机数的位数 */
/* {time} 会替换成时间戳 */
/* {yyyy} 会替换成四位年份 */
/* {yy} 会替换成两位年份 */
/* {mm} 会替换成两位月份 */
/* {dd} 会替换成两位日期 */
/* {hh} 会替换成两位小时 */
/* {ii} 会替换成两位分钟 */
/* {ss} 会替换成两位秒 */
/* 非法字符 : * ? " < > | */
/* 具请体看线上文档: fex.baidu.com/ueditor/#use-format_upload_filename */
/* 涂鸦图片上传配置项 */
"scrawlActionName": "uploadscrawl", /* 执行上传涂鸦的action名称 */
"scrawlFieldName": "upfile", /* 提交的图片表单名称 */
"scrawlPathFormat": "/upload/image/{yyyy}{mm}{dd}/{time}{rand:6}", /* 上传保存路径,可以自定义保存路径和文件名格式 */
"scrawlMaxSize": 20480000, /* 上传大小限制,单位B */
"scrawlUrlPrefix": "", /* 图片访问路径前缀 */
"scrawlInsertAlign": "none",
/* 截图工具上传 */
"snapscreenActionName": "uploadimage", /* 执行上传截图的action名称 */
"snapscreenPathFormat": "/upload/image/{yyyy}{mm}{dd}/{time}{rand:6}", /* 上传保存路径,可以自定义保存路径和文件名格式 */
"snapscreenUrlPrefix": "", /* 图片访问路径前缀 */
"snapscreenInsertAlign": "none", /* 插入的图片浮动方式 */
/* 抓取远程图片配置 */
"catcherLocalDomain": ["127.0.0.1", "localhost", "img.baidu.com"],
"catcherActionName": "catchimage", /* 执行抓取远程图片的action名称 */
"catcherFieldName": "source", /* 提交的图片列表表单名称 */
"catcherPathFormat": "/upload/image/{yyyy}{mm}{dd}/{time}{rand:6}", /* 上传保存路径,可以自定义保存路径和文件名格式 */
"catcherUrlPrefix": "", /* 图片访问路径前缀 */
"catcherMaxSize": 20480000, /* 上传大小限制,单位B */
"catcherAllowFiles": [".png", ".jpg", ".jpeg", ".gif", ".bmp", ".webp"], /* 抓取图片格式显示 */
/* 上传视频配置 */
"videoActionName": "uploadvideo", /* 执行上传视频的action名称 */
"videoFieldName": "upfile", /* 提交的视频表单名称 */
"videoPathFormat": "/upload/video/{yyyy}{mm}{dd}/{time}{rand:6}", /* 上传保存路径,可以自定义保存路径和文件名格式 */
"videoUrlPrefix": "", /* 视频访问路径前缀 */
"videoMaxSize": 204800000, /* 上传大小限制,单位B,默认100MB */
"videoAllowFiles": [
".flv", ".swf", ".mkv", ".avi", ".rm", ".rmvb", ".mpeg", ".mpg",
".ogg", ".ogv", ".mov", ".wmv", ".mp4", ".webm", ".mp3", ".wav", ".mid"], /* 上传视频格式显示 */
/* 上传文件配置 */
"fileActionName": "uploadfile", /* controller里,执行上传视频的action名称 */
"fileFieldName": "upfile", /* 提交的文件表单名称 */
"filePathFormat": "/upload/file/{yyyy}{mm}{dd}/{time}{rand:6}", /* 上传保存路径,可以自定义保存路径和文件名格式 */
"fileUrlPrefix": "", /* 文件访问路径前缀 */
"fileMaxSize": 204800000, /* 上传大小限制,单位B,默认50MB */
"fileAllowFiles": [
".png", ".jpg", ".jpeg", ".gif", ".bmp",".webp",
".flv", ".swf", ".mkv", ".avi", ".rm", ".rmvb", ".mpeg", ".mpg",
".ogg", ".ogv", ".mov", ".wmv", ".mp4", ".webm", ".mp3", ".wav", ".mid",
".rar", ".zip", ".tar", ".gz", ".7z", ".bz2", ".cab", ".iso",
".doc", ".docx", ".xls", ".xlsx", ".ppt", ".pptx", ".pdf", ".txt", ".md", ".xml"
], /* 上传文件格式显示 */
/* 列出指定目录下的图片 */
"imageManagerActionName": "listimage", /* 执行图片管理的action名称 */
"imageManagerListPath": "/upload/image/", /* 指定要列出图片的目录 */
"imageManagerListSize": 20, /* 每次列出文件数量 */
"imageManagerUrlPrefix": "", /* 图片访问路径前缀 */
"imageManagerInsertAlign": "none", /* 插入的图片浮动方式 */
"imageManagerAllowFiles": [".png", ".jpg", ".jpeg", ".gif", ".bmp", ".webp"], /* 列出的文件类型 */
/* 列出指定目录下的文件 */
"fileManagerActionName": "listfile", /* 执行文件管理的action名称 */
"fileManagerListPath": "/upload/file/", /* 指定要列出文件的目录 */
"fileManagerUrlPrefix": "", /* 文件访问路径前缀 */
"fileManagerListSize": 20, /* 每次列出文件数量 */
"fileManagerAllowFiles": [
".png", ".jpg", ".jpeg", ".gif", ".bmp",".webp",
".flv", ".swf", ".mkv", ".avi", ".rm", ".rmvb", ".mpeg", ".mpg",
".ogg", ".ogv", ".mov", ".wmv", ".mp4", ".webm", ".mp3", ".wav", ".mid",
".rar", ".zip", ".tar", ".gz", ".7z", ".bz2", ".cab", ".iso",
".doc", ".docx", ".xls", ".xlsx", ".ppt", ".pptx", ".pdf", ".txt", ".md", ".xml"
] /* 列出的文件类型 */
}
修改了类似下方截图的位置,页面中有几处都要修改增加webp。

到此,webp格式可以在后台位置任意上传了。
本文标签:
很赞哦! ()
相关教程
图文教程
pbootcms网站阿里云虚拟主机验证码不显示的解决方法
这种情况需要去主机面板里设置开启php.ini的输出缓冲区数据,启用后刷新页面OK
pbootcms伪静态配置写法(IIS7、Apache、Nginx)
pbootcms伪静态配置教程,针对IIS7环境、Apache环境、Nginx环境不同的配置方案,配置程序伪静态后URL中将不再包含index.php,整个地址更美观。
pbootcms上传图片失败或提示:后端配置项没有正常加载,上传插件不能正常使用!
PbootCMS-V3.1.3版本后台正常使用,但是编辑器上传图片一直显示无法成功,今天就来处理这个问题。
PbootCMS站点地图地址
在PbootCMS中,动态站点地图(sitemap)是一种非常实用的功能,可以实时生成XML格式的站点地图,便于搜索引擎抓取和索引。下面是如何配置和使用动态站点地图的详细步骤
相关源码
-
(PC+WAP)蓝色低碳环保隔断板装修装饰类网站pbootcms源码下载本款基于PbootCMS开发的网站模板为活动隔断板、装修装饰行业打造,特别适合移动隔断、环保隔断、办公分区等产品的展示与推广。查看源码 -
(响应式H5)帝国cms7.5文章新闻博客模板带会员中心本模板基于帝国CMS内核开发,为新闻资讯、个人博客及作品展示类网站设计。采用响应式布局技术,确保在手机、平板和电脑等不同设备上都能获得良好的浏览体验。查看源码 -
自适应容器设备机械行业通用pbootcms网站模板本模板是一款基于PbootCMS开源内核深度开发,为容器制造、容器设备、压力容器及相关行业量身打造的高品质响应式企业网站模板。查看源码 -
(PC+WAP)蓝色弹簧针厂家探针充电连接器设备网站源码下载基于PbootCMS开发的响应式模板,为弹簧针、探针连接器等电子元器件企业设计。模板采用工业蓝主色调,突出产品技术特性,支持多维度展示连接器产品的规格参数与应用场景,帮助制造企业建立专业线上展示平台。查看源码 -
(自适应)营销型健身器材产品设备类pbootcms模板网站为健身器材企业打造的营销型网站模板,基于PbootCMS开源内核开发。采用HTML5响应式架构,PC与移动端数据实时同步,适配多终端展示场景。查看源码 -
蓝色工业机械五金设备pbootcms模板源码下载(PC+WAP)为机械制造与五金设备企业设计的响应式网站模板,基于PbootCMS内核开发。采用蓝色工业风格强化行业属性,宽屏布局突出设备细节展示,支持PC与WAP端自适应查看源码
| 分享笔记 (共有 篇笔记) |

