WordPress 实现 HTML5 预加载方法

WordPress 实现 HTML5 预加载方法,HTML5新增加了预加载页面技术,预加载是一种浏览器机制,使用浏览器空闲时间来预先下载/加载用户接下来很可能会浏览的页面/资源,当用户访问某个预加载的链接时,如果从缓存命中,页面就得以快速呈现。

IE11、Firefox、chrome 和 opera 支持  HTML5 预加载技术,预加载不一定是一个网页,并不一定是网页文件 其他静态资源JS、CSS、图片等等一样可以。

下面教大家如何让WordPress 实现 HTML5 预加载方法:

1.「后台」→「外观」→「编辑」 「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 } ?>

如果想加个判断预读首页,可以根据上面的代码修改:

<?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 } ?>

这样我们就基本完成 WordPress 实现 HTML5 预加载方法,快试试效果吧!

© 版权声明

相关文章

暂无评论

您必须登录才能参与评论!
立即登录
暂无评论...

欢迎进入官方群聊(关注最新消息)

QQ群698305982 点击进入  


登录即可开启个人书签等新功能! 点击登录

如果网站对您有帮助的话,希望您能把快导航网分享给身边朋友,感激不尽!


(登录后有效期内不再显示)

点击下方关闭此窗口