B2主题文章内页点击展开更多

很久前的一个子主题中提取出来的，JUSTNEWS主题也有类似的功能，有需要可以在本站找找。

效果图

功能上是可以增加网站的PV,但是之前百度好像严打过这种按钮一次。

教程

将下面的代码放入你主题的functions.php中，可以放子主题。

//字数统计

function word_num () {

	global $post;

	$text_num = mb_strlen(preg_replace('/\s/','',html_entity_decode(strip_tags($post->post_content))),'UTF-8');

	return $text_num;

}

css代码

/*阅读全文*/

#contTab{

    display: none;

}

.content-more{

    display: none;

}

#contTab:checked ~ #cont{

    max-height: 1000px;

    overflow: hidden;

}

#contTab:checked ~  .content-more{

    display: block;

    position: relative;

    padding-top: 20px;

    padding-bottom: 30px;

    text-align: center;

}

#contTab:checked ~  .content-more .gradient{

    background-image: -webkit-gradient(linear,left top,left bottom,from(rgba(255,255,255,0)),to(#fff));

    background-image: -webkit-linear-gradient(top,rgba(255,255,255,0),#fff);

    background-image: linear-gradient(-180deg,rgba(255,255,255,0),#fff);

    height: 80px;

    position: absolute;

    left: 0;

    top: -79px;

    width: 100%;

}

#contTab:checked ~  .content-more .readmore{

    display: inline-block;

    background: #f44360;

    color: #fff;

    width: 175px;

    height: 42px;

    border-radius: 42px;

    line-height: 42px;

    font-size: 16px;

    cursor: pointer;

}

文章页的修改

找到

<?php the_content(); ?>

修改为

<?php if (word_num() > 250) { ?>

        <input type="checkbox" id="contTab" checked="checked" class="tabbed">

        <div id="cont">

        <?php the_content(); ?>

        </div>

        <div class="content-more"><div class="gradient"></div> <label for="contTab" class="readmore">点击展开全文</label></div>

        <?php } else { ?>

        <?php the_content(); ?>

        <?php } ?>

提示： 本站一律禁止以任何方式发布或转载任何违法的相关信息访客发现请向站长举报，会员发帖仅代表会员个人观点，并不代表本站赞同其观点和对其真实性负责。本网站的资源部分来源于网络，如有侵权烦请发送邮件至：522552094@qq.com