wordpress中无插件完成内容目录索引

wordpress中无插件完成内容目录索引

假设依托大量的插件完成各种性能，会添加服务器累赘，拖慢页面打开速度，添加网站的平安隐患。
　　能完成内容目录索引的插件次要有：Auto Anchor List、Content Index for WordPress、WP-TOC、seo Friendly Table of Contents等。用法大同小异。
　　今天给大家说一下WordPress无插件完成内容目录索引。
　　工具/原料
　　wordpress模板文件。
　　富文本编辑器，引荐editplus.
　　方法/步骤
　　1
　　把下面的代码放到模板所在的function.php文件里
　　function article_index($content) {
　　  $matches = array();
　　  $ul_li = '';
　　  $r = "/<h3>([^<]+)<\/h3>/im";
　　  if(preg_match_all($r, $content, $matches)) {
　　      foreach($matches[1] as $num => $title) {
　　          $content = str_replace($matches[0][$num], '<h4 id="title-'.$num.'">'.$title.'</h4>', $content);
　　          $ul_li .= '<li><a href="#title-'.$num.'" title="'.$title.'">'.$title."</a></li>\n";
　　      }
　　      $content = "\n<div id=\"article-index\">
　　              <strong>文章目录</strong>
　　              <ul id=\"index-ul\">\n" . $ul_li . "</ul>
　　          </div>\n" . $content;
　　  }
　　  return $content;
　　}
　　add_filter( "the_content", "article_index" );
　　2
　　在咱们内容编辑的时分，切换到HTML编辑器，然后在需求索引的题目用H3标注，详细的用H几要和上面的定义FUNCTION对应，默许的是H3。然后在显示的时分会主动抓取。
　　为了达到丑化的效果，需求用到CSS，详细的还是要依据须要调整。
　　#article-index {
　　  -moz-border-radius: 6px 6px 6px 6px;
　　  border: 1px solid #DEDFE1;
　　  float: right;
　　  margin: 0 0 15px 15px;
　　  padding: 0 6px;
　　  width: 200px;
　　  line-height: 23px;
　　}
　　#article-index strong {
　　  border-bottom: 1px dashed #DDDDDD;
　　  display: block;
　　  line-height: 30px;
　　  padding: 0 4px;
　　}
　　#index-ul {
　　  margin: 0;
　　  padding-bottom: 10px;
　　}
　　#index-ul li {
　　  background: none repeat scroll 0 0 transparent;
　　  list-style-type: disc;
　　  padding: 0;
　　  margin-left: 20px;
　　}