!
您也想出现在这里吗? 点击联系我们
内容广告区块
当前位置:首页>源码分享>B2源码> B2主题文章内页点击展开更多 显示引导下载APP

B2主题文章内页点击展开更多 显示引导下载APP

点击展开更多弹出提示框,确定跳转APP页面,取消展开全文


B2主题文章内页点击展开更多 显示引导下载APP

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;
}
function add_confirm_popup_script() {
    ?>
        <script type="text/javascript">
            var readMoreButton = document.querySelector('.readmore');
            readMoreButton.addEventListener('click', function(e){
                var wantToExpand = confirm('下载APP查看更多内容?');
                if(!wantToExpand){
                   
                }
                else {
                    window.location.href = 'https://'; //替换此处的链接为需要跳转的链接
                }
            });
        </script>
    <?php
}
add_action('wp_footer', 'add_confirm_popup_script');

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 } ?>

文章链接:https://sjcnh.cn/1319.html
文章标题:B2主题文章内页点击展开更多 显示引导下载APP
文章版权:@花醉 所发布的内容,部分为原创文章,转载请注明来源,网络转载文章如有侵权请联系我们!我们将在24小时内极速处理!
本文最后更新发布于2023年07月19日 10时39分20秒,某些文章具有时效性,若有错误或已失效,请在下方留言或联系:841134898@qq.com

您已阅读完《推荐(共38篇)》专题的第 4 篇。您可以继续阅读该专题下面的文章:

本文声明 本站上的部份代码,教程,软件,插件来自会员发布以及互联网收集,不代表本站立场,仅供网友个人学习交流或测试研究使用,未经原版权作者许可,禁止用于任何商业途径!请用户仔细辨认内容的真实性,避免上当受骗!本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。请在下载24小时内删除!若您喜欢本文可附上原文链接随意转载。如无意侵害了您的权益,请发送邮件841134898@qq.com 或点击右侧 私信:花醉 反馈,我们将尽快处理。如果遇到付费才可观看的文章,建议升级终身VIP。全站所有资源“任意下免费看”。本站资源少部分采用7z压缩,为防止有人压缩软件不支持7z格式,建议下载7-zip。zip、rar解压,建议下载WinRAR。

给TA赞助
共{{data.count}}人
人已赞助
!
您也想出现在这里吗? 点击联系我们
内容广告区块
4 条回复Z文章作者V管理员
  1. 花醉

    人是要整活的——没活了,可不就是死了么?

  2. 花醉

    谎言不一定是谎言,被发现的谎言,才算是谎言。

  3. 花醉

    就像那句狠话:有一天,我一定会后悔的。

  4. 花醉
    花醉给作者打赏了¥20
个人中心
今日签到
有新私信 私信列表
有新消息 消息中心
快速搜索
在线客服
关注我们
  • 扫码打开当前页

  • 微信公众号

返回顶部