预加载,听名字就很nb,就是打开网站之前的那部分要做的内容,不知道大家有没有感觉使用谷歌浏览器的时候打开网站速度比使用ie打开的速度会快上些,原因就是谷歌浏览器可以实现预加载的功能。
其实我们也可以实现一个简单的预加载,在你主题文件的head.php顶部加入以下代码
- <link rel=“dns-prefetch” href=“//wp.5v13.com” />
地址请自行修改! 既然本文要说的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模版,与之间。
当然我们也可以让这段代码更加人性化一点,加上个判断首页
- <?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 } ?>
当然也可加入一个上下页的预加载
- <?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’); ?>”>
- <link rel=“prefetch” href=“<?php echo get_permalink(get_next_post(false,”)); ?>”>
- <link rel=“prerender” href=“<?php echo get_permalink(get_next_post(false,”)); ?>”>
- <link rel=“prefetch” href=“<?php echo get_permalink(get_previous_post(false,”)); ?>”>
- <link rel=“prerender” href=“<?php echo get_permalink(get_previous_post(false,”)); ?>”>
- <?php } ?>
over,收功!!!
当然我们也可以在首页渲染第一篇文章,这样用户就可以秒开第一篇文章
- function Bing_html5_prerender(){
- query_posts( ‘post_type=post’ );
- the_post();
- if( !have_posts() ) return;
- $url = get_permalink();
- if( is_singular() ) $url = get_bloginfo( ‘url’ );
- echo ‘<link rel=“prefetch prerender” href=“‘ . $url . ‘” />';
- wp_reset_query();
- }
- add_action( ‘wp_head’, ‘Bing_html5_prerender’ );
根据自己的需要来进行有选择的添加代码!
声明:本站所有文章,如无特殊说明或标注,均为本站原创发布。任何个人或组织,在未征得本站同意时,禁止复制、盗用、采集、发布本站内容到任何网站、书籍等各类媒体平台。如若本站内容侵犯了原著者的合法权益,可联系我们进行处理。
评论(0)