返回上一页
客服QQ
客服QQ
一切从沟通开始……
WordPress实现HTML5预加载
作者：睿美印象网站建设工作室 发布日期：2012-11-05
HTML5引入了预加载页面技术，可以大幅度提高您的网站加载时间以及速度。
WordPress实现HTML5预加载方法很简单，把下面代码：
<?php if (is_archive() && ($paged > 1) && ($paged < $wp_query->max_num_pages)) { ?>
<link rel=”prefetch” href=”<?php echo get_next_posts_page_link(); ?>”>
<link rel=”prerender” href=”<?php echo get_next_posts_page_link(); ?>”>
<?php } ?>
加到header.php模版，<head> 与</head>之间。
还可以根据自己的需要对上面的代码进行适当的修改，例如加个判断预读首页等。
<?php if (is_archive() && ($paged > 1) && ($paged < $wp_query->max_num_pages)) { ?>
<link rel=”prefetch” href=”<?php echo get_next_posts_page_link(); ?>”>
<link rel=”prerender” href=”<?php echo get_next_posts_page_link(); ?>”>
<?php } elseif (is_singular()) { ?>
<link rel=”prefetch” href=”<?php bloginfo(‘home’); ?>”>
<link rel=”prerender” href=”<?php bloginfo(‘home’); ?>”>
<?php } ?>
由于预加载是HTML5的一部分，目前并不是所有浏览器都支持，比如：Internet Explorer就不行了。而Firefox、chrome和opera支持该技术。因此如果访问者的浏览器不支持预加载，将什么效果也没有。
至于真的有什么实际效果只能自己去体会了。
转载请注明：睿美印象网站建设工作室www.ruimeiyx.com
WordPress实现HTML5预加载方法很简单，把下面代码：
<?php if (is_archive() && ($paged > 1) && ($paged < $wp_query->max_num_pages)) { ?>
<link rel=”prefetch” href=”<?php echo get_next_posts_page_link(); ?>”>
<link rel=”prerender” href=”<?php echo get_next_posts_page_link(); ?>”>
<?php } ?>
加到header.php模版，<head> 与</head>之间。
还可以根据自己的需要对上面的代码进行适当的修改，例如加个判断预读首页等。
<?php if (is_archive() && ($paged > 1) && ($paged < $wp_query->max_num_pages)) { ?>
<link rel=”prefetch” href=”<?php echo get_next_posts_page_link(); ?>”>
<link rel=”prerender” href=”<?php echo get_next_posts_page_link(); ?>”>
<?php } elseif (is_singular()) { ?>
<link rel=”prefetch” href=”<?php bloginfo(‘home’); ?>”>
<link rel=”prerender” href=”<?php bloginfo(‘home’); ?>”>
<?php } ?>
由于预加载是HTML5的一部分，目前并不是所有浏览器都支持，比如：Internet Explorer就不行了。而Firefox、chrome和opera支持该技术。因此如果访问者的浏览器不支持预加载，将什么效果也没有。
至于真的有什么实际效果只能自己去体会了。
转载请注明：睿美印象网站建设工作室www.ruimeiyx.com
已有 0 条评论
暂无评论
- 包括IE8的浏览器兼容hack汇总
- 跟KingDZ学HTML5之四：继续探究Canvas之路径
- HTML5基础，第2部分：组织页面的输入
- HTML5基础教程系列：第1部分，初试锋芒
- HTML5漫谈（2）–HTML5为什么这样红？
- 第十天 div+css网页标准布局实例教程（二）
- 跟KingDZ学HTML5之十二：Form表单元素新增属性
- 《精通HTML5编程》第三章：介绍Audio和Video标签
- HTML5全屏来袭：支持浏览器原生全屏的JavaScript代码发布
- HTML5移动应用开发第3章：移动Web离线应用
- link和@import的区别
- HTML 5媒体框架Popcorn.js 1.0发布
- 【转】display:inline-block的深入理解
- 仿AS语法来写HTML5—第4章，继承与简单的rpg
- 10个为设计者准备的HTML5在线工具
- 新手怎样开始学div+css
版权所有：睿美印象网络网站建设工作室 2010-2012 服务热线：15636322282（网站建设工作室）
