先声明:本教程的GIF动画选自千图网,所以如果需要商用请前往千图购买商用授权本教程仅供学习交流。

GIF动画样式

1641990373-232059cb5361a93

功能列表

1. 支持判断用户是否为VIP,是VIP则不展示此广告

2. 屏蔽手机端显示

教程开始

首先来到根目录下找到 footer.php 文件( heade.php 都无所谓啦),如图:

日主题美化-给网站添加悬浮动画广告插图1

将图片里的代码添加至 footer.php 文件:(你是什么主题就下载什么)

日主题V2下载

日主题下载

然后将以下CSS代码添加至 后台 => 外观 => 自定义 => 额外CSS 里,如图:

1641990532-d2edf600a956898

#wpon_svip_gif {
        display: none;
        width: 200px;
        height: 61px;
        border-radius: 0 0 13px 13px;
        z-index: 1002;
        right: 30px;
        top: 100px;
        position: fixed;
    }

然后来前台测试一下,分别登录VIP账号和登录普通账号,如图:

注:左图为普通用户账号,右图为VIP账号

目前测试的在RiPro、RiPro-v2主题,其他主题暂时未发布类似的功能,如果自己有能力或者有需求的话可以联系夏柔~

简洁版本

直接将以下代码添加至 footer.php 文件即可。

<div class="showpc"><style>.showpc{display:none;}@media (min-width:960px){.showpc{display:inline;}}</style><div id="wpon_svip_gif" class="wpon_svip_gif" style="display: block;">


<div class="kubao" style="display: none;"></div><p><a class="link animated" href="/vip" data-stat="升级SVIP活动特价" target="_blank" style="border: none; box-shadow: none;"><br><img src="https://www.xunaonao.com/wp-content/uploads/2022/01/1641990373-232059cb5361a93.gif" height="200" width="600"><br></a></p></div></div>