#热门
[WordPress教程] wordpress实现文章内部索引代码 -静鱼客栈

2021-09-30 0 181
请勿商业运营,违法使用和传播!资源仅供研究学习使用!解压密码为:www.52jyu.cn

最近在其他Wordpress博客上看到类似百度百科的文章索引的功能,觉得如果文章太长时可以制作文章索引,让访问者看得更清晰,于是我查询了相关的文章索引资料,给大家讲解下如何给wordpress实现文章内部索引代码。

<code>
/* 文章索引 */
function postIndex($content) {
if(is_single()){
$arr = array();
$makeLi = '';
$replace = "/<list>([^<]+)<\/list>/im";
if(preg_match_all($replace, $content, $arr)) {
foreach($arr[1] as $num => $title) {
$content = str_replace($arr[0][$num], '<h4 id="part-'.$num.'">'.$title.'</h4>', $content);
$makeLi .= '<li><a href="#part-'.$num.'" rel="external nofollow"  title="'.$title.'">'.$title."</a>".$my_content."</li>\n";
}
$content = "\n<div id=\"postIndex\">
<ul>\n" . $makeLi . "</ul>
</div>\n" . $content;
}
}
return $content;
}
add_filter( "the_content", "postIndex" );
// -- END ----------------------------------------

文章内部索引代码使用

<code>
<list>标题1</list>
内容1。。。。。。
<list>标题2</list>
内容2。。。。。。

文章内部索引代码css

<code>
/*文章索引*/
#article-index{float:right;margin:12px 0 0px 10px;padding:0 6px;width:200px;border:1px solid #DEDFE1;-moz-border-radius:6px 6px 6px 6px;background:#fff;line-height:24px}
#article-index span{display:block;padding:0 5px;border-bottom:1px dashed #DDDDDD;font-size:15px;line-height:30px}
#article-index-ul{margin:0;padding:3px 0 5px 0;line-height:22px;font-size:14px}
#article-index-ul li{padding:0;background:none repeat scroll 0 0 transparent;list-style-type:disc}

注意:这个功能比较简单,只能调用一个类标题!

收藏 (0) 打赏

感谢您的支持,我会继续努力的!

打开微信/支付宝/QQ扫一扫,即可进行扫码打赏哦,分享从这里开始,精彩与您同在
点赞 (0)

1. 本站所有资源来源于用户上传和网络,因此不包含技术服务请大家谅解!如有侵权请邮件联系客服!305582964@qq.com
2. 本站不保证所提供下载的资源的准确性、安全性和完整性,资源仅供下载学习之用!如有链接无法下载、失效或广告,请联系客服处理,有奖励!
3. 您必须在下载后的24个小时之内,从您的电脑中彻底删除上述内容资源!如用于商业或者非法用途,与本站无关,一切后果请用户自负!
4. 如果您也有好的资源或教程,您可以投稿发布,成功分享后有U点奖励和额外收入!

静鱼客栈 学习中心 [WordPress教程] wordpress实现文章内部索引代码 -静鱼客栈 https://www.52jyu.cn/9660.html

静鱼客栈的帅逼站长~

常见问题
  • 本站所有资源版权均属于原作者所有,这里所提供资源均只能用于参考学习用,请勿直接商用。若由于商用引起版权纠纷,一切责任均由使用者承担。更多说明请参考 VIP贵宾介绍。
查看详情
  • 最常见的情况是下载不完整: 可对比下载完压缩包的与网盘上的容量,若小于网盘提示的容量则是这个原因。这是浏览器没有下载完整造成的,可以重新进行下载即可~
查看详情

相关文章

发表评论
暂无评论
官方客服团队

为您解决烦忧 - 24小时在线 专业服务