導讀:seo建站技術seo建站技術文章索引相當于文章目錄，點擊目錄自動跳轉到相應位置，這就需要你的文章有小標題，像我經常用h3標簽來做小標題，這樣所有的h3標簽就能形成一個索引目錄。我們要做的就網站的搭建建站文章。
文章索引相當于文章目錄，點擊目錄自動跳轉到相應位置，這就需要你的文章有小標題，像我經常用h3標簽來做小標題，這樣所有的h3標簽就能形成一個索引目錄。我們要做的就是把h3標簽自動識別出來并組裝成一個目錄，好了，開始實現方法。
實現方法
在文章里必須有h3標簽，每一個三織夢模板下載級標題都會成為索引中的一項。將下面的代碼放到function.php中，就會在你的文章中自動生成一個索引。
function?article_nav($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],?'<h3?id="article_nav_'?.?$num?.?'">'?.?$title?.?'</h3>',?$content);
????????????$ul_li?.=?'<li><a?href="#article_nav_'?.?$num?.?'"?title="'?.?$title?.?'">'?.?$title?.?"</a></li>";
????????}
????????if?(is_singular())?{
????????????$content?=?'<div?id="fn_article_nav"><div?id="article_nav_title">Article?Nav</div><ul>'
????????????????.?$ul_li?.?'<li><a?href="#respond">發表評論</a></li></ul></div>'?.?$content;
????????}
????}
????return?$content;
}
add_filter("the_content",?"article_nav");
索引樣式
索引是生成了，但是只是在文章中的一個普通ul list，我們要做的是把他獨立出來，所以只需要為它寫一個css樣式就好了。推薦用position:fixed把他固定到左邊或者右邊，下方提供了一個參考樣式（見上圖），可以根據自己的情況去修改。
#article_nav_title{font-size:11px;text-align:center;line-height:15px;color:#cc0000;border-left:3px?#cc0000?solid;border-bottom:1px?#aaa?dotted}
#fn_dede模板下載article_nav{position:fixed;left:5px;top:140px;background-color:rgba(255,255,255,.55);border-radius:?0?3px?3px?0;box-shadow:0?0?2px?#aaa}
關鍵詞標簽: 建站 文章 索引
聲明: 本文由我的SEOUC技術文章主頁發布于:2023-07-23 ，文章為WordPress添加文章索引,seo建站技術主要講述索引,文章,建站網站建設源碼以及服務器配置搭建相關技術文章。轉載請保留鏈接: http://m.bifwcx.com/article/web_35720.html
