WordPress纯代码实现Sitemap.html网站静态归档地图

虫子君

580
文章

263
评论

2019年12月2日00:21:03 评论 505 4064字阅读13分32秒

一直以来大家伙在讨论SEO的时候都主张网站一定要有一个sitemap.xml的网站地图，方便蜘蛛过来的时候爬取数据。那有时候网站的结构非常深的时候，如果有一个页面可以列出当前网站的所有网站链接，这个对于这个功能或许对于蜘蛛的帮助不大，但是对于一些真的想要看文章的人来说未必不是一个很好的idea。

如果说实现sitemap.xml网站地图实现起来很是方便，但是sitemap.html这个地图的时候，则并没有那么方便的了。技术大佬不屑于将这种内容发表出来，然而真正需要的人却不知道上哪里找这样的参考文章。

对于sitemap.html这个文件，那是因为虫子君之前使用baidu links submit的时候用到的一个很好的功能，我觉得这个功能虽然不一定对蜘蛛带来很好的帮助，但是对于有的用户需要查找文章的时候，这个功能还是非常好用的，首先人家可以在你的分类当中，一眼就可以看到自己需要的内容。

说了那么多，今天在浏览主题当中的代码的时候发现的一个小功能，将主题当中的模板文件拿出来修修改改以后，居然可以很方便的实现在自己的网站当中建立一个sitemap.html的网站地图。而且还可以自己定义css样式，如果你懂一些css的话，真的还可以做到漂亮。

<?php
/*
Template Name:Sitemap网站地图
Plugin URI: https://chonzi.com
*/
?>
<!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'); ?>" />
<meta name="author" content="CXVN.COM" />
<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-sitemap { background: #eee; }
.sitemap-box { margin: 25px auto; padding: 2%; width: 92%; line-height: 24px; background: #fff; }
.sitemap-box h1 { margin-bottom: 20px; font-size: 20px; text-align: center; }
.sitemap-box a:link, sitemap-box a:visited { color: #333; }
.sitemap-box #breadcrumb, .sitemap-box .full-version { border: 1px solid #eee; background: #f8f8f8; }
.sitemap-box .archivers { padding: 5px 15px 15px; overflow: hidden; }
.sitemap-box #breadcrumb, .sitemap-box .archivers, .sitemap-box .full-version, .sitemap-box #footer { margin-top: 20px; padding: 6px 15px; border: 1px solid #eee; border-top: 1px solid #ddd; clear: both; }
.sitemap-box #footer { padding: 10px; text-align: center; }
</style>
</head>
<body class="page-sitemap">
<div class="sitemap-box">
<h1>
<a href="<?php bloginfo('url'); ?>/" rel="home"><?php bloginfo('name'); ?></a>的网站地图</h1>
<div id="breadcrumb">
<a href="<?php bloginfo('url'); ?>/">
<strong><?php bloginfo('name'); ?></strong></a>&nbsp; » &nbsp;
<a href="<?php echo get_permalink(); ?>" title="<?php bloginfo('name'); ?>SiteMap">SiteMap</a></div>
<div class="archivers page-list">
<h2>全站页面</h2>
<ul>
<?php wp_page_menu( $args ); ?>
</ul>
</div>
<div class="archivers category-list">
<h2>全站栏目</h2>
<ul>
<?php wp_list_categories('title_li='); ?>
</ul>
</div>
<div class="archivers post-list">
<h2>最新内容</h2>
<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 class="clearfix"></div>

<div id="footer">
<p>Copyright © 2019
<a href="<?php bloginfo('url'); ?>/"><?php bloginfo('name'); ?></a> All rights reserved.</p></div>
</div>
</body>

</html>

使用的方法非常的简单，需要您在您的本地电脑上面新建一个php文件，然后将我提供的代码粘贴进去，最后保存一个非中文的名称。

如果你不会操作的话，也可以直接下载虫子君已经做好的模板文件！

将代码粘贴到php文件当中以后，保存，再将这个文件，直接丢到你的WordPress主题的根目录，如：begin主题那就是begin主题的根目录（function.php同级目录），其实模板文件放在主题的根目录也是可以的，如果方便管理的话，还是推荐您将模板文件，丢到你主题的pages文件夹当中吧。（专门存放功能模板的文件夹）。