当前位置:首页-文章-wordpress-正文

7b2 主题改造之添加网易云歌单 iframe 播放器

7b2 主题改造之添加网易云歌单 iframe 播放器
方法与步骤:
此次用到 functions-templates.php、style.css、mobile.css 三个文件,functions-templates.php 在主题 seven/inc 目录下,后两个文件在主题根目录。

1:functions-templates.php:
第 482 行 div id="go-top" class="go-top" :style="'z-index:'+index">下添加以下代码:

  1. <div id="go-top" class="go-top" :style="'z-index:'+index">  
  2.     <div class="pos-r tool-button style-change">  
  3.         <button class="text"><i class="iconfont iconfont zrz-icon-font-gonggao"></i><span>Music</span></button>  
  4.         <div class="music">  
  5.         </div>  
  6.     </div>  

其中网易云的 iframe 代码需要自己去网易云获取,把 iframe 代码粘贴到 div class="music">代码粘贴处/div>
PS:由于完整贴代码导致页面错乱故把:<去掉。
2:style.css:
文本末端添加以下样式:

  1. .tool-button .music {  
  2.     displaynone;  
  3. }  
  4. .tool-button:hover .music {  
  5.     displayblock;  
  6.     positionabsolute;  
  7.     rightright: 80%;  
  8.     top: -490%;  
  9. }  

3:mobile.css:
搜索@media screen and (max-width:670px){大概 90 行左右,在下面添加以下代码:

  1. .pos-r.tool-button.style-change {  
  2.     displaynone;  
  3. }  

原文链接: https://www.chiser.cc/1109.html

本文来源CHISER,经授权后由lixianguo发布,观点不代表鲜果博客的立场,转载请联系原作者。