WordPress 引入css/js 是我们制作主题时首先面对的一个难点,任何一款主题都要加载自己的 css,js,甚至很有可能还需要加载 Jquery 文件,网上方法特多,说法不一,我们今天借鉴 wordpress 官方最新的 twentysixteen 主题来学习总结一下 WordPress 引入 css/js 各种常用方法,以及最优化的加载方法。
产品的完善是无止境,每过段时间就会发现产品的新问题,使用的人越多,提的需求也会越多,我听得最多的一句话就是:如果加上某某功能就完美了。其实,完美是不存在的,每个人的视角不一样,完美的定义也是不一样的。
启用了autoptimize来优化页面加载。其主要功能是优化压缩html,合并js和css代码,减少http请求次数,加快页面加载。 但启用后就发现页面加载存在异常,console有报错信息。
这些包括由WordPress添加的标准脚本以及由使用wp_enqueue_scripts函数的主题和插件添加的一些脚本。 根据脚本的类型,它可能位于网页的头部,正文或页脚部分。
为WordPress网站添加一个音乐播放器,网上大部分的教程都是使用各种插件,有的插件还需要花钱买授权,用着不爽。本文用纯代码为网站添加音乐播放器,安全可靠,可以任意修改。
双 11 光棍节,我在博客发布了一篇给博客部署一个友好对话框的教程,用了几天感觉非常不错!就进一步折腾了一下,目前这个 js 已实现以下多种功能: 一、功能描述 ①、能够取得访客的搜索来路和搜索关键词
在我们开发WordPress主题时,细心的小伙伴或发现网站头部如果加载head页面就会出现很多系统自带的加载项目,例如自带的css、js、feed、style等多余信息。
突然发现更新到wordpress3.9以后,网站的打开速度变得超慢。开始还以为是自己服务器的原因,把网站从美国搬家到中国香港,还是一样慢。然后仔细排查了一下原因,发现是由于 Google服务器无法访问造成的,因为新版wordpress系统中会加载谷歌Opensans字体样式,导致网站非常的慢,需要等待很久。本人新手,有问题喜欢到网上“拿来”。下面是在网上找到的办法,本人懒,采用的第二种方法,问题已经解决。 第一、取消谷歌Open sans字体加载(wp更新不受影响) 1、添加代码法 通过禁用谷
WordPress 主题最佳引用 js 文件的方法是使用 WordPress 内置的 wp_enqueue_script() 函数,通过该函数可以安全地将javascript 代码加入到 WordPress 创建的页面中,不仅可以最大限度地保证兼容性,还是提高 WordPress 性能效率的一个方法。
作者:matrix 被围观: 14,574 次 发布时间:2019-03-07 分类:Wordpress 零零星星 | 2 条评论 »
WP Fastest Cache 是一个多功能缓存插件,通过创建HTML文件来帮助减少您网站的页面加载时间,由于 WordPress 网站是通过 PHP 和 MySQL数据库呈现的,因此每次从服务器请求页面时都需要使用 RAM 和 CPU,会减慢加载时间,并在用户的计算机或设备以及数据库上投入更多精力。但是,使用缓存系统,页面会呈现一次,然后存储为静态 HTML 文件,从而减少每个新访问者的加载时间。
在 wordpress 主题或插件中加载 JavaScript 时,官方推荐的方法是使用 wp_enqueue_script() 来加载,该函数可以指定 JavaScript 的依赖库,指定 JavaScript 文件的版本,设置在页面头部或者底部加载,非常灵活和方便。但是,该插件缺少指定在某些页面加载 JavaScript 的设置参数。所幸的是,我们可以通过 WordPress 的函数自己动手来实现这个功能。
本篇文章内容分享给大家如何对wordpress后台地址进行修改的几种方法,供大家使用和参考,wordpress程序的默认登陆地址链接为http://xxx.com/wp-login.php。为保障网站安全性,可以修改wordpress登陆文章的名称wp-login.php后缀来防止密码被暴力破解。
在实际的运用中有这样一种场景,某资源加载完成后再执行某个操作,例如在做导出时,后端通过打开模板页生成PDF,并返回下载地址。这时前后端通常需要约定一个flag,用以标识模板准备就绪,可以生成PDF了。
总体思路 1、 建立一个js服务,该服务实现通用js文件的加载、依赖、缓存、更新以及复用。 2、 各个项目如果使用通用js,可(bi)以(xu)使用js服务实现加载。 3、 Js服务只提供通用的js,比如jQuery、my97、easyUI等(可根据实际情况设定具体的js文件)。 4、 其他针对特点需求写的js文件,需要自己写代码加载。Js服务可以提供加载用函数。(正在考虑要不要使用sea.js) 5、 Js服务加载的js文件,不需要做任何修改。当然也不负责各个文件里的函数名称是否冲突。 Se
作者:matrix 被围观: 2,616 次 发布时间:2013-10-09 分类:Wordpress 兼容并蓄 零零星星 | 2 条评论 »
使用范围: OA、MIS、ERP等信息管理类的项目,暂时不考虑网站。 遇到的问题: 完成一个项目,往往需要引用很多js文件,比如jQuery.js、easyUI等。还有自己写的一些列js文件,那么这些文件如何方便的加载,如果文件有变化如何才能让客户端及时更新缓存?如果能够提高点运行效率,那就更好了。 目标: 1、 可以方便的引用js文件。 2、 尽量使用各种缓存,避免频繁从服务器读取文件。 3、 如果js文件有更新或者增加、减少几个减少js文件,需要客户端能够自动、立刻更新。 4、 Js文件
WordPress 中的jQuery 库问题曾经困扰了我一段时间。如果仅仅加载WordPress 自带的jQuery 库,在使用一些jQuery 插件的时候明明是代码没有错误,但就是不起作用,该有的效果不能实现;但加载了原版的jQuery 库却又可以了,这样一来却同时加载了两个jQuery 库,网页速度拖慢了而且根本没有必要。 后来才了解到:为了防止与其他 JS 库(如 YUI)冲突,WordPress 内置 jQuery 库的末尾都在原版的基础上加入了 jQuery.noConflict()这个东东,以至
在开发WordPress 主题或者WordPress 插件时候,常常要通过wp_enqueue_script这个钩子挂载WordPress 自带的 jQuery库而非是通过硬编码的方式来加载,毕竟是为了避免多次加载 jQuery库。但在实际操作中,常常会有各种各样的问题出现。 因为WordPress 自带的 jQuery库会在最后添加jQuery.noConflict()以保证与其他js 库的兼容,因此那些通过 $ 代替jQuery的缩写代码会失效。详见《WordPress中的jQuery库不起作用的相关问
本文主要是分享对Wordpress核心代码与功能的优化,对wordpress核心代码的优化与删减将会提升你的网站后台速度,都是为了让你的Wordpress网站更快!
WP Rocket,知名的收费WordPress缓存插件,WP静态缓存优化插件,主要用于页面缓存、静态文件优化,缓存预加载、调整缓存规则等。其它WP缓存优化加速插件推荐:WPJAM Basi(水煮鱼招牌插件),WP Supre Cache(张戈的纯代码版),如果你的服务器是小宽带,建议还是动静分离、静态资源托管CDN。
我们在做wordpress主题时一般会引入jQuery.min.js,比如1.12.4版本,这时想禁掉WordPress自带jQuery.js的加载(不禁掉的话可能会出现新添加的js代码无法正常运行),如何实现呢?随ytkah一起来看看吧
wp_enqueue_script( $handle, $src, $deps, $ver, $in_footer );
其实,这是一个历史遗留问题,在最开始建站的时候就已经出现了,在知更鸟主题和 Crayon Syntax Highlighter 这个插件之间,我最终选择了前者。 在知更鸟主题环境下启用 Crayon Syntax Highlighter 插件,会出现如下冲突情况: ①、图片暗箱失效 ②、下载暗箱失效 ③、公告不能滚动 刚接触建站时,张戈也是一个绝对的菜鸟,除了运维啥都不会,出现这些问题时,只能舍弃其中一个。。。 随着接触建站时间的增长,已经能够编写一般的 php 和 js 脚本、会修改绝大部分网站功能了。这
Contact Form 7 是一个非常强大并且易用的联系表单的插件,我在很多项目中都用到它,但是这个插件有个很不好的地方,会在整个博客的所有前台页面都加载 Contact Form 7 的 JavaScript 和 CSS 代码,对于性能要求极致的我们,当然不允许这样的事情发生,所以我们可以通过下面的代码实现只在含有 Contact Form 7 表单的页面加载 Contact Form 7 的 JS 和 CSS 代码。
一般来说,在html页面底部 (也就是</body>之前)引入JavaScript,如jQuery 和 jQuery插件是个不错的做法。原因很简单,HTTP / 1.1规范表明浏览器不能并行下载两个以上的组件。
Google Code Prettify 是 Google 开源的一个用于代码高亮的 Javascript 库,支持 C/C++, Java, Python, Ruby, PHP,Javascript 等常见语言。使用Prettify一般只需包含两个文件:prettify.js 和 prettify.css。压缩过后的 prettify.js 大小差不多在 15K 左右,非常小巧。
相关文档:https://www.wpzhiku.com/document/wordpress-plugin-basics/
wp-config.php 是 WordPress 用来保存配置信息的地方,包含网站的基础配置详细信息(如数据库连接信息),它是 WordPress 最重要的文件之一,该文件位于 WordPress 文件目录的根目录中。
如果你更新了WordPress 最新版本的4.2 版本,查看网页源代码你会发现WordPress 会自动在head加载一段用于支持emjo 表情的脚本(JS+CSS),对于大部分人来说,这个是十分鸡肋的功能,反而影响加载速度。 原因分析 脚本就是类似下面的代码: <script type="text/javascript"> window._wpemojiSettings = {"baseUrl":"http:\/\/s.w.org\/images\/core\/emoji\/72x72\/","ext":
大家都知道wordpress过于庞大,到了一定的访问量之后就有亿点点的卡顿,加载时间特别感人。但是,WP Fastest Cache这时候就有点用,设置也比较简单,并且拥有汉化,可以切换多种语言。插件有付费版,但是我觉得没有什么必要,免费版功能很全,已经满足缓存需求了。
追求成绩是浪费时间 没有哪个网站能获得理想的成绩,实际上几乎是不可能达到的,而且由于它与速度无关,为什么还要麻烦? 如果您试图获得完美的成绩,则通过实施Google PageSpeed提出的所有建议,您将很快失去理智。
说明:WordPress由外国人开发的,使用了很多国外网站服务,比如Gravatar镜像、谷歌字体之类的,由于我们在国内,链接速度自然就慢了很多,有的还时不时的被墙,很影响使用,而且功能很强大,但是很多我们都不需要,这里我们可以通过修改function.php来精简WordPress,从而使网站速度变快。
分享几个社会化评论插件多说的提速技巧:1. 不再查询 WordPress 原生的留言。 2. 不再加载 comment-reply.js,3.把多说的 JavaScript 脚本移到 footer。
最近发现Wordpress有时候加载的特别慢,于是就想办法找了下原因。之前听网上说是因为wordpress用的是Google的字体库,而且是每次都要加载,导致访问慢的,于是当时装了个Disable Google Fonts的插件,禁用了Google字体,然后装了一个Useso take over Google插件,将字体文件改为360托管的字体库,这样就可以访问快点了。当时的效果的确挺好的,结果最近在使用的时候又发现网站访问慢了,用Chrome查了下资源加载的情况,发现访问useso的字体库的时间特别的长。这时候改用Google字体的时候反而更快了。。。这就十分令人惆怅了,有时候用useso的快,有时候用google的快,真的挺麻烦的。后来想想干脆把这个文件下到服务器上不就好了么。。。于是就倒腾出了下面的办法,将当前主题的字体文件下载到了服务器上。
安全研究人员 Denis Sinegubko 和 Adrian Stoian 近日发现,假冒的 jQuery Migrate 插件通过包含的混淆代码来加载恶意软件从而注入了数十家网站。
WP rocket是一款优秀的网站速度优化的插件,用于对网站内容进行缓存,它的设置比较简单,效果很好。
每次在wordpress网站修改文章的时候都会产生一个修订版本,wp_posts会产生一个post_type为“REVISIONS”的记录,修改次数一多的话,那修订版本就有几万条记录了
WordPress灰常强大的一款主题插件,网上很多地方在出售汉化版,今天在这里免费分享
这是一个历史遗留问题,自从博客部署了 PHP 纯静态缓存之后,所有页面都是 html 静态内容了,而且在七牛 CDN 静态分离之后,速度更是达到极致! 不过也带来不少疑难问题,在之前写的《启用 WP
WordPress 在 wp-includes/default-constants 定义了 WordPress 常用常量的默认值,这些常量都可以在 wp-config.php 中预先定义,这里都会判断如果在 wp-config.php 定义了,就不设置默认值。
首先转载两篇文章 JS中height、clientHeight、scrollHeight、offsetHeight区别 关于scrollTop,offsetTop,scrollLeft,offsetLeft用法介绍
因为我们无法通过任何方法获取整个页面的大小和当前加载了多少,所以想制作一个加载进度条的唯一办法就是模拟。那要怎么模拟呢?
在搜索引擎中搜索关键字 .htaccess 缓存,你可以搜索到很多关于设置网站文件缓存的教程,通过设置可以将css、js等不太经常更新的文件缓存在浏览器端,这样访客每次访问你的网站的时候,浏览器就可以从缓存中获取css、js等静态文件,而不必从你的服务器再次下载读取,这样在一定程度上加快了网站的打开速度,又可以节约一下你的服务器流量。
WordPress 的 wp_localize_script 函数从它名字可以看出它是用来进行前端本地化的,它的工作方式是加载翻译之后的文本,接着将它们当做一个 JavaScript 对象输出到 HTML 中,然后 JS 脚本就用该对象去输出对应语言的文本了。
之前测试了一下WP Super Cache静态插件,这次又测试了cos-html-cache静态缓存插件,重点还是解决wp-postviews插件与HotNews Pro主题兼容问题。
现在,我们就要针对wordpress影响网站响应速度的因素进行具体问题具体分析,并探求正确的方法论高效率有效地解决问题。
每个插件和主题可能有自己的 CSS 和 JavaScript 内联代码或者文件,如果 CSS 和 JavaScript 内联代码或者文件一多,就开始出现了两个比较难受的问题:
领取专属 10元无门槛券
手把手带您无忧上云