- 资源介绍
- 更新记录
- 安装教程
很多时候我们在WordPress上发布一些文章的时候里面都包含了很多的代码,柠檬一般又不喜欢把代码压缩起来而喜欢让代码格式化显示,但是格式化显示通常会让文章内容看起来很多,不便于访问者浏览,所以今天就介绍一种可以展开/收缩文章内容的功能。
教程
1、在header.php中添加下面的代码,或者也可以单独写进一个js文件中然后在header.php中引入也可以。我是引入的。
2、在function.php中加入下面的代码:
//展开收缩功能
function xcollapse($atts, $content = null){
extract(shortcode_atts(array(\"title\"=>\"\"),$atts));
return \'
\'.$title.\'
展开/收缩
\'.$content.\'
\';
}
add_shortcode(\'collapse\', \'xcollapse\');
3、可以优化一下代码,因为默认是靠左的,不好看,我们让他往中间一点显示,具体的距离可以自行调整。当然这一步忽略也是可以的。 在diy.css中添加以下代码:
.xControl {
padding-left: 32px;
}
猜你喜欢
-
wordpress获取当前分类名称或别名的详细教程_52弹弹堂-5466shop.cn
2020-08-28 -
WordPress如何调用当前文章作者头像_52弹弹堂-5466shop.cn
2020-08-28 -
WordPress如何添加用户自定义上传头像功能_52弹弹堂-5466shop.cn
2020-08-28 -
WordPress主题在线一键生成网站underscores_52弹弹堂-5466shop.cn
2020-08-28 -
WordPress实现不同用户等级显示不同內容_52弹弹堂-5466shop.cn
2020-08-28 -
WordPress SEO优化之如何给文章关键词标签自动添加内链_52弹弹堂-5466shop.cn
2020-08-28 -
WordPress美化教程-为文章内容页添加展开收缩功能_52弹弹堂-5466shop.cn
2020-08-28 -
wordpress主题页面顶部实现加载进度条_52弹弹堂-5466shop.cn
2020-08-28 -
WordPress如何调用指定分类文章_52弹弹堂-5466shop.cn
2020-08-28 -
给WordPress博客添加返回顶部/底部的教程_52弹弹堂-5466shop.cn
2020-08-28
-
WordPress列表上下页数字分页导航代码_52弹弹堂-5466shop.cn
2020-08-28 -
WordPress移除head头部js、css、feed等多余加载项_52弹弹堂-5466shop.cn
2020-08-28 -
WordPress主题常用模板名称、常用标签和函数大全_52弹弹堂-5466shop.cn
2020-08-28 -
WordPress获取本周/今日/24小时内更新的文章数量_52弹弹堂-5466shop.cn
2020-08-28 -
WordPress根据分类别名或ID选择内容页模板_52弹弹堂-5466shop.cn
2020-08-28 -
Blues主题1.7版本发布及更新内容说明_52弹弹堂-5466shop.cn
2020-08-28 -
WordPress文章上一篇下一篇显示缩略图_52弹弹堂-5466shop.cn
2020-08-28 -
WordPress升级更新方法详解_52弹弹堂-5466shop.cn
2020-08-28 -
如何WordPress站点添加自定义角色,例如VIP会员用户_52弹弹堂-5466shop.cn
2020-08-28 -
WordPress技巧:获取统计文章内图片数量_52弹弹堂-5466shop.cn
2020-08-28
猜你在找
5466资源网 » WordPress美化教程-为文章内容页添加展开收缩功能_52弹弹堂-5466shop.cn
- 2020-08-28Hi,初次和大家见面了,请多关照!