-
使用 HTML img 惰性属性和链接预加载图像来提高页面性能
我们可以轻松地做两件事来提高我们网页上的图像性能： 1. 延迟加载图像：基本上，延迟加载图像意味着仅当我们需要在视图中显示它时才对该 img 发出请求。 让我们举一个例子，我们有一长串垂直图像： <img src="cat1.png" /> <img src="cat2.png" /> <!-- many cats here -…- 2
- 0
-
HTML图片解码async属性有什么作用，如何帮助我们提升性能
默认情况下，浏览器同时加载文本和图像。同步。这看起来不错，因为它在加载完成后为用户提供了完整的体验。 但是如果你遇到这样的情况怎么办： <p>some intro text</p> <img src="big_and_expensive_img_to_load" /> <p>text with very imporant info…- 7
- 0
-
First Contentful Paint 首次内容绘制 (FCP)
首次内容绘制 (FCP) 是测量 感知加载速度 的一个以用户为中心的重要指标，因为该项指标会在用户首次在屏幕上看到任何内容时，在页面加载时间轴中标记出相应的点，迅捷的 FCP 有助于让用户确信某些事情正在进行。 1. 什么是 FCP？ 首次内容绘制 (FCP) 指标测量页面从开始加载到页面内容的任何部分在屏幕上完成渲染的时间。对于该指标，"内容"指的是文本、图像（包括背景图像）…- 230
- 0
-
Google网站核心指标Core web vitals(LCP、FID、CLS)是什么？
前言 2020 年5 月28 日， Google 在官方部落格中针对使用者体验推出了新的3 项Core web vitals (暂译网站核心指标)。这三项指标分别对网站载入速度(LCP)、可开始互动的时间(FID)、以及页面稳定性(CLS) 分别进行评分。与此同时，Google 也在这份文章中提到，除了3 项网站核心指标外，行动版友好度、安全性浏览、HTTPS/SSL、跳版式广告同时也会影响网站…- 736
- 0
-
WordPress网站js脚本延迟和异步加载教程
前言 每次页面渲染时，WordPress都会加载一系列外部引用JavaScript。 这些包括由WordPress添加的标准脚本以及由使用wp_enqueue_scripts函数的主题和插件添加的一些脚本。 根据脚本的类型，它可能位于网页的头部，正文或页脚部分。 位于页面头部和主体部分内的脚本可能会导致页面加载延迟，因为浏览器甚至在页面内容之前尝试加载和执行这些脚本。 这就是为什么这些脚本被称为渲…- 415
- 0
-
WordPress网站加载速度优化
一，网站打开速度的重要性 1，网站有投放 Google adwords或 Facebook广告等，广告转化率糟糕，那么网站打开速度是最直接最基础的影响因素之一。 2，做SEO方面，在网页可被搜索引擎爬虫抓取的前提下，网站速度也是最直接最基础影响网站seo排名的因素之一； 对于Google SEO：一个是： 首字节时间（TTFB），一个是：网页打开时间。 二，wordpress网站打开速…- 451
- 0
-
wordpress自定义文章类型功能添加
公司的自研主题开发，最近几个都需要用到：自定义文章类型 通过自定义文章类型来，来处理和归类不同的内容类型 下面以添加产品中心来举例： 1.在主题函数functions.php中添加一下代码 add_action( 'init', 'create_product_post_types' ); function create_product_post_types…- 432
- 0
-
Pods 插件自定义字段的导入导出
Pods 是一款用在 WordPress 上的自定义内容类型的插件。pods 能够扩展现有的内容类型，比如为文章 （post）增加一个 “SEO标题” 字段。更重要的是，它添加的字段都能导入导出JSON格式，方便开发和正式环境的配置使用。 一. 安装Pods 插件 二. 打开Pods 插件的导出导出设置 找到Pods 的Components 菜单，找到右侧的 Migration 选项：打开下面两…- 464
- 0
-
如何修复WordPress内容更新和发布失败错误
如果您的WordPress网站在您尝试进行更改时返回诸如“更新失败”或“发布失败”之类的错误消息，那么结果不仅令人沮丧，而且还会阻止访问者访问他们需要的内容。 幸运的是，有一些常见的原因和解决方法可以帮助您在遇到此问题时解决它。通过一些故障排除，您应该立即恢复到您的常规发布时间表。 在本文中，我们将讨论导致WordPress内容“更新失败”和“发布失败”错误的原因。然后我们将解释您可以修复或解决问…- 522
- 0
-
WordPress自定义查询：WP_Query的使用
wordpress默认会根据网址调用数据，不能满足我们所有建站要求，而WP_Query可以用于查询任何你想要的内容，相当于自定义数据调用。 wordpress的主循环 <?php if ( have_posts() ) : while ( have_posts() ) : the_post(); the_title(); endwhile; endif; ?&…- 565
- 0
-
WordPress调用指定分类下的文章
调用WordPress指定分类的文章代码如下: <ul> <?php query_posts('cat=15&posts_per_page=10'); while(have_posts()): the_post(); ?> <li><a href="<?php%20the_permalink();?>&qu…- 534
- 0
-
wordpress开启子目录多站点模式并给子站绑定独立域名
wordpress开启多站点模式，多站点模式即是使用一套wordpress程序就可以搭建多个独立、互不干扰的wordpress站点，各站点之间的用户、文章、附件等都互不干预。wordpress的多站点模式对于需要搭建多个不同语言外贸站子站点的用户，或者不同主题的演示网站的用户来说都非常理想。 开启多站点： 1、编辑wordpress网站根目录的wp-config.php文件，在文件中添加以下代码：…- 601
- 0
-
移除(wp_head)函数-头部不必要的元素标签
以下内容都在主题的functions.php文件写入 1.移除WordPress版本信息 remove_action( 'wp_head', 'wp_generator' ); 2.移除离线编辑器开放接口 remove_action( 'wp_head', 'rsd_link' ); remove_action( &#…- 976
- 0
-
WPMEI主题-解决邮件问题-使用使用SMTP发送邮件教程
前言 网站已经做好了，但是怎么不能发送邮件呢？这是主题的bug吗？还是wordpress的bug? 其实都不是，最大的bug可能就是你的主机了，一般主机都不支持默认都不支持邮件发送的 但是还好，可以使用SMTP来发送邮件。主题中有很多功能也是需要发送邮件的，比如找回密码、下单通知、邮箱验证码等等。所以一个网站发送邮件的功能是必不可少的！ wpmei主题已经内置了SMTP功能，所以其他同类型插件可以…- 640
- 0
-
Options Framework后台设置框架 (文末下载)
一. 前言 这是Options Framework插件的改编wordpress主题版本。使用选项框架可以轻松地在任何WordPress主题中包含一个选项面板。 它的构建使开发人员可以专注于制作实际wordpress主题，而不用花费时间从头开始创建选项面板。 这是一套主题，内含框架，这样设置是为了方便wordpress开发者更好的使用这套框架。如果您对此有疑惑，参见下方的中文教程链接。 项目地址：G…- 733
- 0
-
WordPress开发 – options framework基础应用
前言 看到好多免费的wordpress主题都采用了这套后台设置框架，就拿来研究下，其实设置框架也有很多类型，重要的不在于他的设置有多丰富，而是这个框架的使用是否明确。 正好，这款options framework 框架就贴心的准备了一款主题来帮助各位新手开发者来了解这套框架，可惜的是，即使有这套主题的帮助，很多新手开发者对此也是一知半解，难以使用，这次在网络上找到了一份有详细使用教程的文档，大家一…- 617
- 0
-
WordPress开发 – Options Framework轻量级后台框架使用
Options Framework新特性 轻量级 基于wordpress原生api实现，提供了比较全面的常用选项 界面与wordpress统一，当然也可以自己定制 功能强大，使用简单 Options Framework其实是一款主题，安装启用，就可以看到效果了，这时候会在后台→外观菜单下面多出来一个“Theme Options”的菜单（如果需要在左侧主菜单中显示该选项，可通过add_menu_pa…- 680
- 0
-
wordpress 学习笔记 (二)
1.主题文件构成 存放目录：wp-content/themes 必要文件：style.css 和 index.php 主题信息：存放在style文件头部 主题信息 Theme Name: 主题的名称 Theme URI: 主题的网址 Author: 作者的名称 Author URI:作者的网址 Description: 主题的简介 Version: 1.0 版本信息 主题默认能够识别的文件名 名称…- 879
- 0
-
wordpress 学习笔记 (一)
核心知识 1.主题必须包含的文件： style.css index.php 注：文件夹里包含这两个的文件，就能被wordpress 识别。 主题的缩略图名称：screenshot.png 2.主题的信息显示 写在style.css头部，这里展示主要如下： /* Theme Name: 主题的名称 Theme URI: 主题的URL Author: 作者名称 Author URI: 作者的URL D…- 543
- 0
-
WordPress 主题文件
一. WordPress主题结构 WordPress主题文件放置在wp-content\themes目录下面。 一个文件夹代表一个主题，一个主题最少需要两个文件，分别是 index.php 和 style.css 其中index.php是默认的入口文件，style.css是默认的样式文件，也是主题信息的配置文件，它的格式如下： /* Theme Name: 青梅博客 …- 739
- 0
-
WordPress首页文件的加载顺序
我们需要修改主题的时候，尤其时需要修改首页时，我们需要知道首页文件的加载顺序： WordPress首页文件的加载顺序： 1、front-page.php 2、后台--设置--阅读所设置的页面。 3、home.php 4、index.php 如上排序，如果你主题里面有 front-page.php 文件，那么你后台设置首页是无效的 注意：如果在 wp-content 下面有 db.php 的话也会重…- 627
- 0
-
wordpress 主题，作者，版本信息的修改
用到的函数： get_theme_data( ) 信息存放的文件 style.css 内容展示图： 遵循规则： 默认WordPress的样式表需要遵从 第一行是主题的名字； 第二行是主题的地址； 第三行是主题的描述； 第四行是主题版本号； 第五行是主题作者名字； 第六行是主题作者主页地址。 get_theme_data 函数分析 该函数将主题文件内的style.css文件中的主题相关信息（也就是…- 573
- 0
-
wordpress主题模板常用的引用方式
wp程序开发中的三种模板引用方式： 1. wp开发中默认的引入模板函数为以下方式：通过默认的 头部、底部及侧边栏文件引入。 get_header(); //引入头部文件-header.php get_footer(); //引入底部文件-footer.php get_sidebar(); //引入侧边栏-sidebar.php 2. 同时，上面的默认函数是可以支持自定义的，比较可以添加自定义的名称…- 523
- 0
-
wordpress的主题名字查找方法
1、查看footer 大部分主题都会在页脚注明主题名称与链接，点击既可。 2、查看源码 搜索style.css 然后查找一个路径为 …../wp-content/themes/xxx/style.css 那么这个xxx就是主题的目录，然后查看这个style源码，源码里的前面几行就是主题介绍包括名字和作者等信息。 3、用Chrome的审查元素 右侧有CSS的链接，点击就能看到style.css了，一…- 529
- 0
-
￥优惠劵使用时效：无法使用使用时效：
之前
使用时效：永久有效优惠劵ID：×