实现WordPress文章展开/收缩的效果
发布时间：2025-10-23 09:44:56 本站作者 【 字体：大 中 小 】 浏览：112 次
1、修改footer.php文件
加入到body之前
<script>jQuery(document).ready(
function(jQuery){
jQuery('.collapseButton').click(function(){
jQuery(this).parent().parent().find('.xContent').slideToggle('slow');
});
});</script>2、修改functions.php文件
加入到主题functions.php文件中
//展开收缩功能
function xcollapse($atts, $content = null){
extract(shortcode_atts(array("title"=>""),$atts));
return '<div style="margin: 0.5em 0;">
<div class="xControl">
<span class="xTitle">'.$title.'</span> ==> <a href="JavaScript:void(0)" class="collapseButton xButton"><span class="xbtn02">展开/收缩</span></a>
<div style="clear: both;"></div>
</div>
<div class="xContent" style="display: none;">'.$content.'</div>
</div>';
}
add_shortcode('collapse', 'xcollapse');3、代码使用：
{collapse title="标题"}需点击展开的内容{/collapse}
将上述代码中的{}分别替换为[]
补刀：CSS美化一下吧
/* 展开收缩*/.xControl {
background: #f6f6f6;
}
.xTitle {
color: #333;
}
.xbtn02{
color: #428bca;
text-decoration: underline;
}在编辑文章的时候快速添加该按钮 :
//添加展开/收缩快捷标签按钮
function appthemes_add_collapse() {
?><script type="text/javascript">// <![CDATA[
QTags.addButton( 'collapse', '展开/收缩按钮', '{collapse title="说明文字"}','{/collapse}' );// ]]>
</script><?php
}
add_action('admin_print_footer_scripts', 'appthemes_add_collapse' );将上述代码中的{}分别替换为[]
将上述代码添加到主题functions.php文件中，然后在编辑文章的时候切换到文本模式，就可以看到该按钮.
按钮使用方法：先单击一次，然后输入你想要收缩的内容，再单击一次按钮，然后替换替换其中的说明文字。
热门推荐
最新发布
马蹄粉是木薯粉吗?马蹄粉和木薯粉一样吗？
马蹄粉是木薯粉吗?马蹄粉不是木薯粉。马蹄粉是由荸荠（马蹄）制成的粉末，含有丰富的维生素B和C，具有清热去湿、解毒的功效，常用于制作马蹄糕等点心。而木薯粉是由木薯根茎提取的淀粉，加水预热煮熟后会呈现透明状，口感带有弹性，常用于制作珍珠奶茶中的珍珠、芋圆、麻薯糍粑等食品。两者在原材料、口感、用途、营养价值及...
家里有臭虫是什么原因引起的？应该怎么办？
家里有臭虫是什么原因引起的？臭虫是一种喜欢藏在床垫、床板缝隙中的虫子。家里为什么会出现臭虫？1、环境原因：房间内空气不流通，晒不到太阳，平常盖被和垫被也不经常晒，到了臭虫繁殖季节，自然容易滋生臭虫。2、卫生条件：家庭的卫生状态非常重要，湿垃圾是否每天清理，卫生死角是否一周处理一次，如果没有每周...
家里为什么会有臭虫？什么原因引起的
家里会有臭虫的原因有：1、家里气候潮湿，人多房间小，空气不流通，有利于臭虫的孳生。2、床板上垫制皮或粘胶纸对臭虫提供了生存条件。3、家里床板质量不佳，致使臭虫可以在类似之处孳生。4、外界臭虫飞入家里，等等。除臭虫方法有哪些：人工捕捉：敲击床架、床板、炕席、草垫等，将臭虫震下、处死，或用针、铁丝挑出缝隙中...
红茶和绿茶的区别功效 二者的常见功效及区别
红茶和绿茶的区别功效是什么？本文由小编为您具体来介绍一下。（一）红茶和绿茶的区别主要体现在适用人群不同、冲泡水温不同、存放时间不同三个方面。1、适用人群不同：红茶和绿茶的区别不仅仅表现在功效方面，适用人群也不一样。胃病者更适合饮用红茶，由于红茶经过发酵，不属寒性，因此养胃，胃病者不能喝绿茶但可以喝红茶...
