Zibll子比主题-给WordPress网站添加一款非常好看的底部导航

Zibll子比主题-给WordPress网站添加一款非常好看的底部导航

29611

源地址：https://www.tianyubk.com/231.html#hidden-box-comment

开始教程

第一步

在主题目录下：themes/zibll/functions.php 文件最下方添加以下代码：

//【底部导航栏】开始 天域<a href="https://www.tianyubk.com/tag/%e5%8d%9a%e5%ae%a2" target="_blank">博客</a> www.tianyubk.com
//获取评论数量
function zfunc_comments_users($postid=0,$which=0) {
  $comments = get_comments('status=approve&type=comment&post_id='.$postid); //获取文章的所有评论
  if ($comments) {
    $i=0; $j=0; $commentusers=array();
    foreach ($comments as $comment) {
      ++$i;
      if ($i==1) { $commentusers[] = $comment->comment_author_email; ++$j; }
      if ( !in_array($comment->comment_author_email, $commentusers) ) {
        $commentusers[] = $comment->comment_author_email;
        ++$j;
      }
    }
    $output = array($j,$i);
    $which = ($which == 0) ? 0 : 1;
    return $output[$which]; //返回评论人数
  }
  return 0; //没有评论返回0
};
// 随机文章
function random_posts(
    $posts_num=5,$before='<li>',$after='</li>'){
    global $wpdb;
    $sql = "SELECT ID, post_title,guid
            FROM $wpdb->posts
            WHERE post_status = 'publish' ";
    $sql .= "AND post_title != '' ";
    $sql .= "AND post_password ='' ";
    $sql .= "AND post_type = 'post' ";
    $sql .= "ORDER BY RAND() LIMIT 0 , $posts_num ";
    $randposts = $wpdb->get_results($sql);
    $output = '';
    foreach ($randposts as $randpost) {
        $post_title = stripslashes($randpost->post_title);
        $permalink = get_permalink($randpost->ID);
        $output .= $before.'<a class="item-foot" href="'
            . $permalink . '"  rel="bookmark" data-toggle="tooltip" data-original-title="随机文章：';
        $output .= $post_title . '"><svg class="icon" aria-hidden="true"><use xlink:href="#icon-gonggao1"></use></svg><span id="wz">' . $post_title . '</span></a>';
        $output .= $after;
    }
    echo '<div id="footgundong" class="wz"><ul>'.$output.'</ul></div>';
}
//弹窗提醒
function dorzs() {  
echo '<script src="https://www.tianyubk.com/插件/小工具/底部导航栏/sweetalert.min.js"></script>';
echo '<script src="https://www.tianyubk.com/插件/小工具/底部导航栏/sweetalert.css"></script>'; 
echo '<script>$(document).on("click","#dorzs",function(){swal({title:"发工资啦",text:"哇！超级开心的！！",

icon:"https://www.tianyubk.com/插件/小工具/底部导航栏/icon.jpg",buttons:{weixin:{text:"微信",value:"weixin",},
zfb:{text:"支付宝",value:"zfb",},dsmd:{text:"打赏名单",value:"dsmd",},},}).then(function(value){if(value=="weixin"){swal({title:"感谢打赏！",
text:"感谢您的微信打赏，我会努力做得更好！",button:false,
icon:"https://www.tianyubk.com/插件/小工具/底部导航栏/wx.png"});}else if(value=="zfb"){swal({title:"感谢打赏！",
text:"感谢您的支付宝打赏，我会努力做得更好！",button:false,icon:"https://www.tianyubk.com/插件/小工具/底部导航栏/zfb.png"});}else if(value=="dsmd")
{swal({title:"打赏名单",text:"【打赏名单未开放】",icon:"https://www.tianyubk.com/插件/小工具/底部导航栏/icon.jpg",button:false,});}});});</script>';  
}  
add_action( 'wp_footer', 'dorzs', 100 );
//点赞统计
function dz($post_id){
    global $wpdb;
    $sql = "SELECT SUM(`meta_value`) as num FROM `wp_postmeta` WHERE `meta_key`='like' AND `post_id`=$post_id";
    $results = $wpdb->get_results($sql);
    echo  $results[0]->num;
}
//【底部导航栏】结束 天域博客 www.tianyubk.com

第二步

引用阿里巴巴矢量库图标，可自行修改，在 子比主题后台 – 自定义代码 – 自定义头部HTML代码 里面添加下面代码：

<!--【天域博客自用阿里图标库】开始 天域博客  www.tianyubk.com--> 
<script src="//at.alicdn.com/t/c/font_3800775_f50abrt2vy5.js"></script>

第三步

在主题目录下：themes/zibll/footer.php 文件 < /footer >下方添加以下代码：

<!--【底部导航栏】开始 天域博客 www.tianyubk.com-->
<style>
#footgundong{margin-left:20px;overflow: overlay;display: inline-flex;text-align: right;}.item-foot{color: var(--minor);height: 45px;line-height: 45px;transition: color 0.35s;white-space: nowrap;}.swal-footer{text-align:center;}.swal-button {font-size: 20px;}.count>svg,.count>text{display:none;}
</style>
<div class="footwaveline">
<i style="background-image: url(https://www.tianyubk.com/插件/小工具/底部导航栏/image.png);display: inline-block;width: 210px;height: 120px;position: fixed;bottom: 0;z-index: 110;background-size: 100%;"></i>

    <div id="shi" style="position: fixed;bottom: 0;margin-left: 200px;z-index: 99;">
       <h4 class="my-face" style="font-size:13px;margin:0 5px 2px 5px;color:#797979;margin-bottom: 10px;">天域博客，与你相遇，甚是美好~</h4>
    </div>
    
<div style="width: 100%;height: 40px;position: fixed;bottom: 0;z-index: 97;box-shadow: 0 -2px 10px rgb(0 0 0 / 10%);background:#fff;">
    <nav class="joe_header__below-logon" style="float: right;margin-right: 50px;">
        <?php if (is_home()) {
              echo'<style>@media (max-width:1200px){#shi{display:none;}}.pl,.fx{display:none;}.dz{display:none !important;}</style>';
              echo random_posts();
            }elseif (is_page()) {
                echo'<style>@media (max-width:1200px){#shi{display:none;}}.pl,.fx{display:none;}.dz{display:none !important;}</style>';
            }
        ?>    
            <span style="margin-left:20px;" class="pl">
                <a href="javascript:(scrollTo('#comments',-100));" data-toggle="tooltip" data-original-title="评论">
                    <svg class="icon" aria-hidden="true"><use xlink:href="#icon-huati1"></use></svg><span style="color:var(--minor);">评论(<count><?php echo zfunc_comments_users($post->ID); ?></count>)</span>
                </a>
            </span>                
            <span class="dz" style="margin-left:20px;display: inline-block;">
                <a href="javascript:(scrollTo('#comments',-1000));" data-toggle="tooltip" data-original-title="点赞">
                    <svg class="icon" aria-hidden="true"><use xlink:href="#icon-dianzan"></use></svg>点赞(<?php echo dz($post->ID)?>)
                </a>
            </span>
            <span style="margin-left:20px;line-height: 45px;" class="fx">
                <a class="share-btn poster" poster-share="<?php the_ID();?>" title="海报分享" href="javascript:;">
                    <svg class="icon" aria-hidden="true"><use xlink:href="#icon-fenxiang"></use></svg>分享
                </a>
            </span>
            <span style="margin-left:20px;line-height: 45px;" class="zs">
                <a id="dorzs" data-toggle="tooltip" data-original-title="赞赏">
                    <svg class="icon" aria-hidden="true"><use xlink:href="#icon-hongbao"></use></svg>赞赏
                </a>
            </span>
            <span style="margin-left:20px;line-height: 45px;" class="sc">
                <a href="javascript:void(0);" id="shoucang" data-toggle="tooltip" data-original-title="收藏">
                    <svg class="icon" aria-hidden="true"><use xlink:href="#icon-shoucang"></use></svg>收藏
                </a>
            </span>
            
            
                <a style="margin-left:20px;display: inline-block;width: 64px;" href="javascript:(scrollTo());" id="percentage" data-toggle="tooltip" data-original-title="返回顶部">
                    <svg class="icon" aria-hidden="true"><use xlink:href="#icon-xiaoshuai"></use></svg>0%
                </a>
  </nav>
</div>
</div>

<?php dorzs();?>
<script>
var btn =document.getElementById("shoucang");
btn.onclick = function (){new Vue({data:function(){this.$notify({title:"⭐ 欢迎收藏本站",message:"使用Ctrl+D即可添加收藏",position:'bottom-right',offset:50,showClose:true,type:"图标"});return{visible:false}}})
return false;}
</script>
<!--【底部导航栏】结束 天域博客 www.tianyubk.com-->

第四步

在 子比主题后台 – 自定义代码 – 自定CSS样式代码 里面添加下面代码：

/*【底部导航栏】开始 天域博客 www.tianyubk.com */
 .my-face {
    animation: my-face 5s infinite ease-in-out;
    color: #00f1ff;
    display: inline-block;
    margin: 0 5px;
}
@-webkit-keyframes my-face {
    2%, 24%, 80% {
        -webkit-transform: translate(0, 1.5px) rotate(1.5deg);
        transform: translate(0, 1.5px) rotate(1.5deg)
    }
    4%, 68%, 98% {
        -webkit-transform: translate(0, -1.5px) rotate(-.5deg);
        transform: translate(0, -1.5px) rotate(-.5deg)
    }
    38%, 6% {
        -webkit-transform: translate(0, 1.5px) rotate(-1.5deg);
        transform: translate(0, 1.5px) rotate(-1.5deg)
    }
    8%, 86% {
        -webkit-transform: translate(0, -1.5px) rotate(-1.5deg);
        transform: translate(0, -1.5px) rotate(-1.5deg)
    }
    10%, 72% {
        -webkit-transform: translate(0, 2.5px) rotate(1.5deg);
        transform: translate(0, 2.5px) rotate(1.5deg)
    }
    12%, 64%, 78%, 96% {
        -webkit-transform: translate(0, -.5px) rotate(1.5deg);
        transform: translate(0, -.5px) rotate(1.5deg)
    }
    14%, 54% {
        -webkit-transform: translate(0, -1.5px) rotate(1.5deg);
        transform: translate(0, -1.5px) rotate(1.5deg)
    }
    16% {
        -webkit-transform: translate(0, -.5px) rotate(-1.5deg);
        transform: translate(0, -.5px) rotate(-1.5deg)
    }
    18%, 22% {
        -webkit-transform: translate(0, .5px) rotate(-1.5deg);
        transform: translate(0, .5px) rotate(-1.5deg)
    }
    20%, 36%, 46% {
        -webkit-transform: translate(0, -1.5px) rotate(2.5deg);
        transform: translate(0, -1.5px) rotate(2.5deg)
    }
    26%, 50% {
        -webkit-transform: translate(0, .5px) rotate(.5deg);
        transform: translate(0, .5px) rotate(.5deg)
    }
    28% {
        -webkit-transform: translate(0, .5px) rotate(1.5deg);
        transform: translate(0, .5px) rotate(1.5deg)
    }
    30%, 40%, 62%, 76%, 88% {
        -webkit-transform: translate(0, -.5px) rotate(2.5deg);
        transform: translate(0, -.5px) rotate(2.5deg)
    }
    32%, 34%, 66% {
        -webkit-transform: translate(0, 1.5px) rotate(-.5deg);
        transform: translate(0, 1.5px) rotate(-.5deg)
    }
    42% {
        -webkit-transform: translate(0, 2.5px) rotate(-1.5deg);
        transform: translate(0, 2.5px) rotate(-1.5deg)
    }
    44%, 70% {
        -webkit-transform: translate(0, 1.5px) rotate(.5deg);
        transform: translate(0, 1.5px) rotate(.5deg)
    }
    48%, 74%, 82% {
        -webkit-transform: translate(0, -.5px) rotate(.5deg);
        transform: translate(0, -.5px) rotate(.5deg)
    }
    52%, 56%, 60% {
        -webkit-transform: translate(0, 2.5px) rotate(2.5deg);
        transform: translate(0, 2.5px) rotate(2.5deg)
    }
    58% {
        -webkit-transform: translate(0, .5px) rotate(2.5deg);
        transform: translate(0, .5px) rotate(2.5deg)
    }
    84% {
        -webkit-transform: translate(0, 1.5px) rotate(2.5deg);
        transform: translate(0, 1.5px) rotate(2.5deg)
    }
    90% {
        -webkit-transform: translate(0, 2.5px) rotate(-.5deg);
        transform: translate(0, 2.5px) rotate(-.5deg)
    }
    92% {
        -webkit-transform: translate(0, .5px) rotate(-.5deg);
        transform: translate(0, .5px) rotate(-.5deg)
    }
    94% {
        -webkit-transform: translate(0, 2.5px) rotate(.5deg);
        transform: translate(0, 2.5px) rotate(.5deg)
    }
    0%, 100% {
        -webkit-transform: translate(0, 0) rotate(0);
        transform: translate(0, 0) rotate(0)
    }
}
@keyframes my-face {
    2%, 24%, 80% {
        -webkit-transform: translate(0, 1.5px) rotate(1.5deg);
        transform: translate(0, 1.5px) rotate(1.5deg)
    }
    4%, 68%, 98% {
        -webkit-transform: translate(0, -1.5px) rotate(-.5deg);
        transform: translate(0, -1.5px) rotate(-.5deg)
    }
    38%, 6% {
        -webkit-transform: translate(0, 1.5px) rotate(-1.5deg);
        transform: translate(0, 1.5px) rotate(-1.5deg)
    }
    8%, 86% {
        -webkit-transform: translate(0, -1.5px) rotate(-1.5deg);
        transform: translate(0, -1.5px) rotate(-1.5deg)
    }
    10%, 72% {
        -webkit-transform: translate(0, 2.5px) rotate(1.5deg);
        transform: translate(0, 2.5px) rotate(1.5deg)
    }
    12%, 64%, 78%, 96% {
        -webkit-transform: translate(0, -.5px) rotate(1.5deg);
        transform: translate(0, -.5px) rotate(1.5deg)
    }
    14%, 54% {
        -webkit-transform: translate(0, -1.5px) rotate(1.5deg);
        transform: translate(0, -1.5px) rotate(1.5deg)
    }
    16% {
        -webkit-transform: translate(0, -.5px) rotate(-1.5deg);
        transform: translate(0, -.5px) rotate(-1.5deg)
    }
    18%, 22% {
        -webkit-transform: translate(0, .5px) rotate(-1.5deg);
        transform: translate(0, .5px) rotate(-1.5deg)
    }
    20%, 36%, 46% {
        -webkit-transform: translate(0, -1.5px) rotate(2.5deg);
        transform: translate(0, -1.5px) rotate(2.5deg)
    }
    26%, 50% {
        -webkit-transform: translate(0, .5px) rotate(.5deg);
        transform: translate(0, .5px) rotate(.5deg)
    }
    28% {
        -webkit-transform: translate(0, .5px) rotate(1.5deg);
        transform: translate(0, .5px) rotate(1.5deg)
    }
    30%, 40%, 62%, 76%, 88% {
        -webkit-transform: translate(0, -.5px) rotate(2.5deg);
        transform: translate(0, -.5px) rotate(2.5deg)
    }
    32%, 34%, 66% {
        -webkit-transform: translate(0, 1.5px) rotate(-.5deg);
        transform: translate(0, 1.5px) rotate(-.5deg)
    }
    42% {
        -webkit-transform: translate(0, 2.5px) rotate(-1.5deg);
        transform: translate(0, 2.5px) rotate(-1.5deg)
    }
    44%, 70% {
        -webkit-transform: translate(0, 1.5px) rotate(.5deg);
        transform: translate(0, 1.5px) rotate(.5deg)
    }
    48%, 74%, 82% {
        -webkit-transform: translate(0, -.5px) rotate(.5deg);
        transform: translate(0, -.5px) rotate(.5deg)
    }
    52%, 56%, 60% {
        -webkit-transform: translate(0, 2.5px) rotate(2.5deg);
        transform: translate(0, 2.5px) rotate(2.5deg)
    }
    58% {
        -webkit-transform: translate(0, .5px) rotate(2.5deg);
        transform: translate(0, .5px) rotate(2.5deg)
    }
    84% {
        -webkit-transform: translate(0, 1.5px) rotate(2.5deg);
        transform: translate(0, 1.5px) rotate(2.5deg)
    }
    90% {
        -webkit-transform: translate(0, 2.5px) rotate(-.5deg);
        transform: translate(0, 2.5px) rotate(-.5deg)
    }
    92% {
        -webkit-transform: translate(0, .5px) rotate(-.5deg);
        transform: translate(0, .5px) rotate(-.5deg)
    }
    94% {
        -webkit-transform: translate(0, 2.5px) rotate(.5deg);
        transform: translate(0, 2.5px) rotate(.5deg)
    }
    0%, 100% {
        -webkit-transform: translate(0, 0) rotate(0);
        transform: translate(0, 0) rotate(0)
    }
}
/* end */
/*底部导航*/
@media (max-width: 800px){.footwaveline{display: none;}}
/*【底部导航栏】结束 天域博客 www.tianyubk.com */

第五步

在 子比主题后台 – 自定义代码 – 自定义javascript代码 里面添加下面代码：

//【底部导航栏-滚动进度条百分比】开始 天域博客 www.tianyubk.com
$(function(){var $this=$("#footgundong");var scrollTimer;$this.hover(function(){clearInterval(scrollTimer)},function(){scrollTimer=setInterval(function(){scrollNews($this)},2000)}).trigger("mouseleave");function scrollNews(obj){var $self=obj.find("ul");var lineHeight=$self.find("li:first").height();$self.animate({"marginTop":-lineHeight+"px"},500,function(){$self.css({marginTop:0}).find("li:first").appendTo($self)})}})
window.onscroll = function() {
  let scrollNow = window.pageYOffset;
  let pageClientHeight = document.documentElement.clientHeight;
  let scrollHeight = Math.max(document.body.scrollHeight, document.documentElement.scrollHeight, document.body.offsetHeight, document.documentElement.offsetHeight, document.body.clientHeight, document.documentElement.clientHeight) - pageClientHeight;
  let fullWindowHeightInPercentage = Math.round((scrollNow / scrollHeight) * 100);
  let percentage = document.getElementById('percentage');
  percentage.innerHTML = '<svg class="icon" aria-hidden="true"><use xlink:href="#icon-xiaoshuai"></use></svg> ' + fullWindowHeightInPercentage + '%';
  if (fullWindowHeightInPercentage == 0) percentage.innerHTML = '<svg class="icon" aria-hidden="true"><use xlink:href="#icon-xiaoshuai"></use></svg> 到顶啦';
  if (fullWindowHeightInPercentage == 100) percentage.innerHTML = '<svg class="icon" aria-hidden="true"><use xlink:href="#icon-xiaoshuai"></use></svg> 到底啦';
}
</script>
//【底部导航栏-滚动进度条百分比】结束 天域博客 www.tianyubk.com

效果如下：

Zibll子比主题-给WordPress网站添加一款非常好看的底部导航-洛秋资源小站


温馨提示：本文最后更新于2024-07-21 01:35:41，某些文章具有时效性，若有错误或已失效，请在下方留言或联系洛秋站长。
© 版权声明
本网站名称：洛秋资源小站
默认解压密码：luoqiu.site
①本站所有资源免费，收取的费用仅为抵扣人工测试和服务器日常维护带来的消耗成本，请须知。
②因源码、模板、插件等程序具有可复制性，一经出售概不退款。
③本站部分资源来源网络或者用户投稿，如有侵权请联系删除。
④本站资源仅用于个人学习和交流，如用于商业使用请选择正版程序。使用非正版程序须在24小时内卸载删除。
➣详细的版权声明请点击文章版权声明查看。
下载/阅读均默认代表您已详细阅读版权声明并同意承担可能造成的所有损失及后果！
THE END
子比主题
# 底部导航
喜欢就支持一下吧
点赞11赞赏 分享
luoqiu的头像-洛秋资源小站钻石会员
TickTick「嘀嗒清单」 解锁会员高级版-洛秋资源小站
TickTick「嘀嗒清单」 解锁会员高级版
TickTick「嘀嗒清单」 解锁会员高级版
4个月前 250
微商助手 一款拥有众多功能的微商工具，提供了海量高效实用的功能-洛秋资源小站
微商助手 一款拥有众多功能的微商工具，提供了海量高效实用的功能
微商助手 一款拥有众多功能的微商工具，提供了海量高效实用的功能
4个月前 229
Pixiv 汇聚了超多二次元原创及同人绘画作品投稿的平台-洛秋资源小站
Pixiv 汇聚了超多二次元原创及同人绘画作品投稿的平台
Pixiv 汇聚了超多二次元原创及同人绘画作品投稿的平台
4个月前 215
Picsart 美易，专为爱美图的你打造，解锁高级版-洛秋资源小站
Picsart 美易，专为爱美图的你打造，解锁高级版
Picsart 美易，专为爱美图的你打造，解锁高级版
4个月前 201
微鲤万年历 原“中华万年历日历”，去广告解锁高级版-洛秋资源小站
微鲤万年历 原“中华万年历日历”，去广告解锁高级版
微鲤万年历 原“中华万年历日历”，去广告解锁高级版
4个月前 200
Beelinguapp 听有声书学习语言，丰富的英语有声读物，解锁高级版-洛秋资源小站
Beelinguapp 听有声书学习语言，丰富的英语有声读物，解锁高级版
Beelinguapp 听有声书学习语言，丰富的英语有声读物，解锁高级版
4个月前 142
相关推荐
子比主题设置版权声明-洛秋资源小站
子比主题设置版权声明
子比主题设置版权声明
4个月前 132
Zibll子比主题7.51开心版wordpress主题-洛秋资源小站
Zibll子比主题7.51开心版wordpress主题
Zibll子比主题7.51开心版wordpress主题
4个月前 129
WordPress子比主题美化教程-备忘录-洛秋资源小站
WordPress子比主题美化教程-备忘录
WordPress子比主题美化教程-备忘录
4个月前 111
Zibll子比主题-评论区新增夸夸一言快捷评论功能-洛秋资源小站
Zibll子比主题-评论区新增夸夸一言快捷评论功能
Zibll子比主题-评论区新增夸夸一言快捷评论功能
4个月前 111
WordPress设置必须登录后才可以发布评论-洛秋资源小站
WordPress设置必须登录后才可以发布评论
WordPress设置必须登录后才可以发布评论
4个月前 104
Zibll子比主题-给WordPress网站添加一款非常好看的底部导航-洛秋资源小站
Zibll子比主题-给WordPress网站添加一款非常好看的底部导航
Zibll子比主题-给WordPress网站添加一款非常好看的底部导航
4个月前 96
评论 共2条

请登录后发表评论

    只看作者
    • zhangyp的头像-洛秋资源小站zhangyp等级-LV1-洛秋资源小站0
      幸福破灭之时，总是伴随着血腥味。
      4个月前北京
    • zhangyp的头像-洛秋资源小站zhangyp等级-LV1-洛秋资源小站0
      世界之大为何我们相遇，难道是缘分，难道是天意。
      4个月前
默认头像
TOP1
TOP2
TOP3
TOP4
TOP5
TOP6
最新评论
luoqiu的头像-洛秋资源小站钻石会员

luoqiu徽章-签到达人-洛秋资源小站25天前0

我又不是因为你们的评价才去当的英雄，是因为我想当才去当的。
luoqiu的头像-洛秋资源小站钻石会员

luoqiu徽章-签到达人-洛秋资源小站42天前1

且视他人之疑目如盏盏鬼火，大胆地去你的夜路。
用户53361299的头像-洛秋资源小站

用户53361299徽章-初出茅庐-洛秋资源小站48天前0

生命本没有意义，你要能给它什么意义，它就有什么意义。
用户53361299的头像-洛秋资源小站

用户53361299徽章-初出茅庐-洛秋资源小站48天前0

暴雨中前进，伞是倒划天空的船。
luoqiu的头像-洛秋资源小站钻石会员

luoqiu徽章-签到达人-洛秋资源小站2个月前0

沉默——真正猎手的选择。
luoqiu的头像-洛秋资源小站钻石会员

luoqiu徽章-签到达人-洛秋资源小站4个月前1

憧憬是距离理解最遥远的感情。
zhangyp的头像-洛秋资源小站

zhangyp4个月前0

幸福破灭之时，总是伴随着血腥味。
zhangyp的头像-洛秋资源小站

zhangyp4个月前0

世界之大为何我们相遇，难道是缘分，难道是天意。

标签云

AdGuard Beelingu Burpsuite EldenRing OneNav Picsart Pixiv Pro TickTick Tik Tok 万年历 主题 二次元 发布评论 嘀嗒清单 国际版抖音 子比 子比主题 导航 屏幕录制 广告拦截程序 底部导航 录像专家 微商助手 微鲤 快捷评论 渗透测试工具 版权声明 破解adobe 磁盘 空间分析 美化教程 美图 美易 艾尔登法环

历史记