最近在看到有些人的博客内容有看到内容中有相关的文章是通过展开和搜索隐藏起来的,但是确实可以提高站内内容的相关联互动。这个是如何实现的呢?这里简单的整理方法,后面试试看。
1、功能部分
//功能部分
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">展开/收缩</a>
<div style="clear: both;"></div>
</div>
<div class="xContent" style="display: none;">'.$content.'</div>
</div>';
}
add_shortcode('collapse', 'xcollapse');
添加到当前主题功能代码里。
2、JS部分
<script type="text/javascript">
jQuery(document).ready(function(jQuery) {
jQuery('.collapseButton').click(function() {
jQuery(this).parent().parent().find('.xContent').slideToggle('slow');
});
});
</script>
展开和搜索需要用到JS。
3、调用方法
这里根据需要的位置调用包含起来。我们也可以用短代码添加到编辑器中。