纯代码实现WordPress网站HTML地图

纯代码实现WordPress网站HTML地图

作者 : 资源客 发布时间: 2019-11-24

常见的网站地图有两种,一种是 XML 格式的地图,另一种是 HTML 格式地图(百度网站地图不是百度地图!请各位小白搜索的时候关键词别用错,别跑来问我百度地图怎么弄,我懂不起。)。XML 格式的网站地图是给搜索引擎蜘蛛看的,而 HTML 网站地图是给用户看的,可以展现自己博客的所有文章和所有页面,能够增加网站的用户体验。在前面的一篇文章中,有介绍过 wordpress 网站地图的添加方法,是用 wordpress 插件来实现的,今天介绍的网站地图添加方法是用代码来实现的。

刚开始建站的时候我觉得柳城的百度 XMLSitemap 生成器插件挺好用的,然后就一直用它,直到作者不更新了。今天介绍的就是不使用插件完成 wordpress 代码实现网站地图 sitemap 的 html 和 xml 的方法,本站以前一直用着柳城的百度地图插件,今天心血来潮,想着还是直接代码吧,少用插件的好!虽然改点代码仍然可以使用,但是多多少少还是有点小问题的。比如谷歌会说他的插件生成的 html 版本网站地图页面可点击项间隔太小,不适合移动端使用的问题,所以我决定自己做一个网站地图页面。

实现步骤

首先是要有一个前端模板,这是最重要的,不然不好看,这个我就不提供了。然后就是使用 WordPress 函数循环输出整站页面地址了,由于我做成了页面,自带头部导航与底部,所以我只需要所有页面、所有文章、所有标签,具体看下面代码。

1、输出所有页面地址

<?php 
    $mypages = get_pages(); 
    if(count($mypages) > 0) {
        foreach($mypages as $page) { 
            echo get_page_link($page->ID);//输出页面地址
            echo $page->post_title;//输出页面标题
        }
     }
?>

2、输出所有文章地址

<?php 
    $myposts = get_posts( "numberposts=1000");//这里输出1000条
    if(count($myposts) > 0) {
       foreach( $myposts as $post ) { 
            echo the_permalink();//输出文章地址
            echo the_title();//输出文章标题
        }
     }
?>

3、输出所有标签地址

<?php 
   $tags = get_terms("post_tag");
   foreach ( $tags as $key => $tag ) { 
        echo get_term_link( intval($tag->term_id), "post_tag" );//输出标签地址
        echo $tag->name;//输出标签标题
    }     
?>

完整步骤

在新建一个 PHP 文件页面 sitemap.php,在里面加上以下代码,再放入主题下的页面文件夹中。

    <?php
    /*
     Template Name: 站点地图
    */
    ?>
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head profile="http://gmpg.org/xfn/11">
    <meta http-equiv="Content-Type" content="text/html; charset=<?php bloginfo( 'charset' ); ?>" />
    <title>站点地图 - <?php bloginfo('name'); ?></title>
    <meta name="keywords" content="站点地图,<?php bloginfo('name'); ?>" />
    <meta name="copyright" content="<?php bloginfo('name'); ?>" />
    <link rel="canonical" href="<?php echo get_permalink(); ?>" />
    <style type="text/css">
        body {font-family: Microsoft Yahei,Verdana;font-size:13px;margin:0 auto;color: #000000;background: #ffffff;width: 990px;margin: 0 auto}
        a:link,a:visited {color:#000;text-decoration:none;}
        a:hover {color:#08d;text-decoration:none;}
        h1,h2,h3,h4,h5,h6 {font-weight:normal;}
        img {border:0;}
        li {margin-top: 8px;}
        .page {padding: 4px; border-top: 1px #EEEEEE solid}
        .author {background-color:#EEEEFF; padding: 6px; border-top: 1px #ddddee solid}
        #nav, #content, #footer {padding: 8px; border: 1px solid #EEEEEE; clear: both; width: 95%; margin: auto; margin-top: 10px;}
    </style>
    </head>
    <body vlink="#333333" link="#333333">
    <h2 style="text-align: center; margin-top: 20px"><?php bloginfo('name'); ?>'s SiteMap </h2>
    <center></center>
    <div id="nav"><a href="<?php echo esc_url( home_url() ); ?>/"><strong><?php bloginfo('name'); ?></strong></a> &raquo; <a href="<?php echo get_permalink(); ?>">站点地图</a></div>
    <div id="content">
    <h3>最新文章</h3>
    <ul>
    <?php
    $previous_year = $year = 0;
    $previous_month = $month = 0;
    $ul_open = false;
    $myposts = get_posts('numberposts=-1&orderby=post_date&order=DESC');
    foreach($myposts as $post) :
    ?>
    <li><a href="<?php the_permalink(); ?>" title="<?php the_title(); ?>" target="_blank"><?php the_title(); ?></a></li>
    <?php endforeach; ?>
    </ul>
    </div>
    <div id="content">
    <li class="categories">分类目录<ul>
    <?php wp_list_categories('title_li='); ?>
    </ul></li>
    </div>
    <div id="content">
    <li class="categories">单页面</li>
    <?php wp_page_menu( $args ); ?>
    </div>
    <div id="footer">查看博客首页: <strong><a href="<?php echo esc_url( home_url() ); ?>/"><?php bloginfo('name'); ?></a></strong></div><br />
    <center>
    <div style="text-algin: center; font-size: 11px">Latest Update: <?php $last = $wpdb->get_results("SELECT MAX(post_modified) AS MAX_m FROM $wpdb->posts WHERE (post_type = 'post' OR post_type = 'page') AND (post_status = 'publish' OR post_status = 'private')");$last = date('Y-m-d G:i:s', strtotime($last[0]->MAX_m));echo $last; ?><br /><br /></div>
    </center>
    </body>
    </html>

以上代码只能作为参考,标签根据自己实际情况进行修改,然后进入 wordpress 后台,创建新的页面,起名为网站地图,(名字随便)内容不需要填写。点击快速编辑按钮,选择模板–网站地图,这样 wordpress 网站地图就制作出来了。

http://xzh.i3geek.com
1. 本站所有资源来源于用户上传和网络,如有侵权请邮件联系站长!
2. 分享目的仅供大家学习和交流,请不要用于商业用途及非法用途,否则后果自负!
3. 如果你也有好源码或者教程,可以到审核区发布,分享有金币奖励和额外收入!
4. 本站提供的源码、模板、插件等等其他资源,都不包含技术服务请大家谅解!
5. 如有链接无法下载、失效或广告,请联系管理员处理!
6. 本站资源售价只是赞助,收取费用仅维持本站的日常运营所需!
7. 如遇到加密压缩包,默认解压密码为"qq301.com",如遇到无法解压的请联系管理员!
资源客是一个优秀的分享资源站,本站资源均为各位友友分享而来,特殊原创会标明如有侵犯版权等可联系删除

资源客 » 纯代码实现WordPress网站HTML地图