找到RiPlus主题/RiPro主题根目录下footer.php文件

在最下面的</body></html>前面添加如下代码:

<div class="waveHorizontals mobile-hide">
  <div id="waveHorizontal1" class="waveHorizontal"></div>
  <div id="waveHorizontal2" class="waveHorizontal"></div>
  <div id="waveHorizontal3" class="waveHorizontal"></div>
</div>

第二步:RiPlus主题/RiPro主题目录-> assets -> css -> diy.css 添加下方样式

.waveHorizontals {
    width: 100%;
    height: 20px;
    position: relative;
    overflow: hidden;
    z-index: 1;
  background-color:#25282a !important
}/*background-color:#25282a 背景底色,根据自己的美化选择颜色*/
.ripro-dark .waveHorizontals {
    width: 100%;
    height: 20px;
    position: relative;
    overflow: hidden;
    z-index: 1;
  background-color:#181616 !important
}
#waveHorizontal1 {
    -webkit-mask: url(https://www.mophp.cn/www.mophp.cn/wp-content/themes/riplus-child/assets/images/mophp_001.svg);
    mask: url(https://www.mophp.cn/www.mophp.cn/wp-content/themes/riplus-child/assets/images/mophp_001.svg);
    animation-delay: -2s;
    animation-duration: 12s;
}
#waveHorizontal1, #waveHorizontal2, #waveHorizontal3 {
    background-image: linear-gradient(20deg,#f84270 0,#fe803b 100%)!important;
}
.ripro-dark #waveHorizontal1{
    background-color: #f1f1f1!important;
}
.ripro-dark  #waveHorizontal2{

发表评论

后才能评论