很多人都说 WordPress 后台很慢,有些同学反馈甚至都需要2-3秒才能打开,并且他们使用的服务器是阿里云 / 腾讯云这些,基本可以排除是服务器问题,那么为什么 WordPress 后台那么慢?
每个插件和主题可能有自己的 CSS 和 JavaScript 内联代码或者文件,如果 CSS 和 JavaScript 内联代码或者文件一多,就开始出现了两个比较难受的问题:
WordPress 默认对分类的排序真的是太弱了,仅支持通过代码的方式使用 ID,使用数量(count),名称(name),别名(slug)等字段进行排序,都没有提供自定义分类的方法,更别提拖动排序。
❝前期回顾: 1. Page Visibility API 2. Broadcast Channel API 3. Beacon API 4. Resize Observer API 5. Clipboard API 6. Fetch API 7. Performance API 8. WebStorage API 9. WebSockets API 10. Fullscreen API 11. Geolocation API ❞
对列表进行拖动排序,尺寸改变。之前一般会使用jQuery-UI(interactjs更加纯粹)。其通过mousedown、mousemove、mouseup这三个事件来实现页面元素被鼠标拖拽的效果。vue-drag-resize vuedraggable等包也大抵如此:https://codepen.io/lujun-zhou/pen/LYybXNx。
| 导语 手Q终端原生的图片预览器支持图片翻页和各种手势,这些用H5怎样实现?基于alloyFinger,本文将介绍在手Q动漫上的图片预览组件是如何做到媲美原生体验的手势效果,同时也介绍一下关于图片手势效果里隐含的一些细节。希望对要实现手势交互和动画的前端同学有所启发。 作者:朱晓华--腾讯web前端工程师 @IMWeb前端社区 一、实现效果 先来看实现效果。目前已经上线的图片预览组件的路径如下:手Q动态——动漫——社区——点击图片。 类比手Q的AIO里的图片预览器,支持的手势和功能分别如下: 手Q动漫
现在来实现排序的问题。要实现远程排序,首先要清楚的是排序信息是如何提交到服务器的,而这个,利用FireBug相当简单。
Vue-chart.js 绘制图标 https://vue-chartjs.org/ Vue-fa 可以使用fontAwesome5 的各种插件 https://cwe;o.github.io/vue-fa/ Vee-validate 基于模板的Vue校验框架 https://baianat.github.io/vee-validate/' eslint-plugin-vue vue语法检查工具,可以快速的定位出错位置 https://eslint.vuejs.org/ vue——lazyload 图片懒
笔者之前利于业余时间开发了一个gif动图生成平台, 具体开发背景我也在上一篇文章手把手教你撸一个能生成抖音风格动图的gif制作平台中介绍过了, 我们今天继续来实现该平台, gif动图平台的实现方式比较将完全用前端的手段来实现, 所以大家在接下来的内容中会发现很多有意思的前端插件. 接下来我们看看主要要实现的功能点:
Sortable —是一个JavaScript库,用于在现代浏览器和触摸设备上对拖放列表进行重新排序。无需jQuery。支持Meteor,AngularJS,React,Polymer,Vue,Ember,Knockout和任何CSS库,例如Bootstrap
WPJAM「分类管理插件」是 WordPress 果酱出品的全能型分类管理插件,这个插件目前主要有七大功能:
tipswindow是一个很一般的JQuery弹出层插件,但使用简单,有相对漂亮的外观,代码比较通俗。下面介绍使用方法:
分享一款基于js的图片排序效果。鼠标拖动图片,重新排列图片的排列顺序。该插件适用浏览器:IE8、360、FireFox、Chrome、Safari、Opera、傲游、搜狗、世界之窗。效果图如下:
进行 WordPress 开发的朋友,肯定知道 WordPress Meta API 的牛逼之处,就是因为有了它,WordPress 真的什么网站都能做。😎 我前面发布的 WordPress 配置器,其中一个很重要的功能就是让你更灵活方便的使用 Post Meta 和 Term Meta,只要用会和用好它,你就才真正掌握 WordPress 的精髓。 所以很多插件都使用 Meta 来实现功能,但是插件用的得多,或者某些插件用得 Meta 字段特多,比如一篇文章,就用了几十个 Meta 字段,那么文章数只要上
对列表进行拖动排序,尺寸改变。之前一般会使用jQuery-UI。其通过mousedown、mousemove、mouseup这三个事件来实现页面元素被鼠标拖拽的效果。vue-drag-resize vuedraggable等包也大抵如此:https://codepen.io/lujun-zhou/pen/LYybXNx。
现在小舒同学会自动定期帮你备份数据。同时记录你使用的浏览器和版本号,方便你恢复数据。
FontAwesome5库的vue实现,可以调用FontAwesome5的各种组件。
---- 项目地址 项目地址👉👉点击进入,可以直接设置为浏览器主页或者桌面快捷方式进行使用,本人在用,长期维护。 源码地址 完全开源,大家可以随意研究,二次开发。当然还是十分欢迎大家点个Star⭐⭐⭐ 👉👉源码链接(gitee) 👉👉源码链接(github) 需求介绍 上面是我一个开源的用来收藏网站的小项目,但是现阶段只能一个一个的按顺序添加网址,这样就产生了一个问题,那就是后添加的一定在下面,而我如果新添加了一个比较常用的网站,而列表
这是我碰到最多的需求了,博客首页的文章如何使用分类进行过滤,有些用户只想某几个分类的文章,而有些用户则不想显示某几个分类的文章。
我是一个原则性很强的人😆,所以对于接单这种小事,我也是有原则的,所以下面就和大家谈谈我接项目的一些小原则,如果你也是通过外包接单过活,希望这篇文章也能够帮助到你。 站在巨人的肩膀上 这是我的第一条原则,也是我觉得最重要的一条原则,我一直说自己不是 PHP 程序员,我是一个 WordPress 程序员,就是基于这条原则对自己的定位,因为我所有的项目都是基于 WordPress 的,而 WordPress 是世界上使用最广的建站系统,最近的统计 WordPress 市场份额不断增长 接近2/5的网站是用它创建的
如果标签没有设置别名,那么固定链接就会带有中文,然后被 urlencode 转义成下面的字符串:
移动端浏览器兼容性较好,我们不需要考虑以前 JS 的兼容性问题,可以放心的使用原生 JS 书写效果,但是移动端也有自己独特的地方。比如触屏事件 touch(也称触摸事件),Android 和 IOS 都有。touch 对象代表一个触摸点。触摸点可能是一根手指,也可能是一根触摸笔。触屏事件可响应用户手指(或触控笔)对屏幕或者触控板操作。
移动端轮播图与PC段轮播图,在技术选择上是有区别的,因为移动端的浏览器版本非常好,对于H5和CSS3的支持非常完美,所以很多效果可以CSS3的方式实现,比如可以使用 Transorm 属性替代原来的动画函数
我们知道默认情况下,WordPress 后台文章列表,可以通过分类进行过滤,那么是否可以通过标签过滤呢?甚至自定义的分类呢?
在与反爬虫的对抗中,我们爬虫的大招有两个,其一是多种ip跟换方式(例如adsl|代理|tor等请参看之前的文章)。其二是无头浏览器,使用自动化的技术来进行自动数据抓取,模拟鼠标与键盘事件,可以用于破解验证码,js解析,诡异的模糊数据这类型的反爬虫技术
WPJAM「用户管理插件」新增记录用户最后登录时间功能,用户登录之后,在后台用户列表就会显示该用户的最后登录时间:
WordPress 果酱知识星球所有插件已经30多款了,这些插件都是我们开发商业网站的基础,也是我们构建花生小店这个电商小程序 SaaS 系统的基础,绝非是世面上的那些胭脂俗粉,都是经过大流量测试和商业验证的插件,罗列一下:
请注意,本文编写于 2082 天前,最后修改于 173 天前,其中某些信息可能已经过时。
H4中的input type:text、password、radio、checkbox、file、hidden、submit、reset、image
WPJAM「评论增强插件」新增后台添加评论功能,这样管理员也给一些文章添加一些评论来丰富文章的内容了,操作也非常简单,在后台的文章列表,点击「添加评论」按钮:
前面我详细介绍了文章查询时如何使用分类,标签或其他分类模式,具体怎么应用呢?我就给 WPJAM「分类管理插件」 增加了一个多重筛选的功能:
WPJAM「内容模板插件」最早的时候,短代码只支持 ID,但是有些同学反馈内容模板多了,ID 记不住,更可怕的时候,由于网站重建,重新导入一下 WP,所有的内容模板 ID 都变了,所有使用了内容模板的文章都得修改。
该插件已经升级为 WPJAM 用户管理插件,并且也集成了自定义头像功能,直接启用即可。
基于Jquery开发的Autocomplete插件。具有易于使用,配置简单,既可以利用Ajax读取数据也可以直接从本地获取数据。
新插件:「站点选项」,它可以让你查看所有非 WordPress 系统自动生成的站点选项,如果你觉得某个选项没有用了,可以直接删除它。
上一篇中,宏哥说的宏哥在最后提到网站的反爬虫机制,那么宏哥在自己本地做一个网页,没有那个反爬虫的机制,谷歌浏览器是不是就可以验证成功了,宏哥就想验证一下自己想法,其次有人私信宏哥说是有那种类似拼图的验证码如何处理。于是写了这一篇文章,另外也是相对前边做一个简单的总结分享给小伙伴们或者童鞋们。废话不多数,直接进入今天的主题。
因为项目上有一个在规定区域内自由拖拽的小需求,自己纯js写又有点小麻烦,就花了点时间寻找到这个小组件。
Dragula是一款支持移动触摸屏设备的纯js元素拖放插件。这个元素拖放插件使用简单,浏览器兼容性好,能够实现通过鼠标或在移动设备中通过手指来拖动DOM元素的位置。
我们知道 WordPress 评论功能好是好,但总觉差点什么,所以我想了想,可能是大家习惯了公众号的留言系统吧,希望也能和公众号的留言一样,可以点赞,管理员还可以置顶评论,所以按照这个需求做了一下,并且能名字也叫做:「WPJAM 评论增强」插件。
React DnD 是一组 React 高阶组件,使用的时候只需要将对应的 API 将目标组件进行包裹,即可实现拖动或接受拖动元素的功能。
摄像机点位的功能主要是在图片地图和在线离线地图上设置对应摄像机的位置,然后双击可以实时预览对应摄像机的视频,在图片地图上拖动摄像机图标到对应位置,系统会自动保存位置信息,在网页地图上的摄像机位置,需要异步更新,比如先从右侧选择需要更新位置的摄像机,然后在地图上鼠标按下,会自动传回当前位置的经纬度信息,然后单击更新设备位置按钮即可,会自动js异步更新执行代码,更新完成以后会自动同步到另外的地图,比如在线地图更新了,离线地图也会自动更新。
github上的官方cropper.js地址是 https://github.com/fengyuanchen/cropperjs
WordPress 之前评论表的 comment_type 字段的默认值一直是空字符,为了更加的语义化,从 5.5 版本开始,WordPress 已经将强制设置为 "comment",这项改动是为了以后更加的方便实现自定义 comment_type 注册。
比如文章内容中提到到了某个标签和分类,或者某个插件和产品的链接,都希望能够快速转成链接,方便用户点击过去。
我们在 基于 Docker 搭建 LinkAce 书签管理器 这篇文章里写了如何通过 Docker 搭建 LinkAce ,但是 Linkace 是基于 PHP 的,所以我们不用 Docker 可能会更方便一点。
最主要的是,由于拖放操作不受浏览器“同源策略“影响,用户可以把一个域的内容拖放到另一个不同的域,由此攻击者可能通过劫持某个页面的拖放操作实现对其他页面链接的窃取,从而获得session key,token,password等敏感信息,甚至能将浏览器中的页面内容拖进文本编辑器,查看源代码。
页面标题是整个站点最重要的地方,如果页面被搜索引擎索引了,在搜索结果中显示的就是页面的标题。WordPress 默认页面标题是一般是两种规则,首页是显示站点标题和站点副标题,而其他页面是当前的对象的标题和博客站点的标题,然后都是中间用「-」间隔开。
Swiper滑块视图容器用来在指定区域内切换内容的显示,可以用于制作图片轮播效果。
在2010的Black Hat Europe大会上,Paul Stone提出了点击劫持的技术演进版本:拖放劫持。由于用户需要用鼠标拖放完成的操作越来越多(如复制粘贴、小游戏等等),拖放劫持大大提高了点击劫持的攻击范围,将劫持模式从单纯的鼠标点击拓展到了鼠标拖放行为。
移动端浏览器兼容性好,我们不需要考虑以前JS的兼容问题,可以放心使用原生JS书写效果,但是移动端也有自己独特的地方,比如触屏事件touch(也叫触摸事件),Android和IOS都有。
领取专属 10元无门槛券
手把手带您无忧上云