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

倒腾了一个晚上,把7b2主题的右侧边栏添加了个网易云iframe播放器,浏览之余可以播放下音乐,美哉!

7b2主题

方法/步骤

此次用到functions-templates.phpstyle.cssmobile.css三个文件,functions-templates.php在主题seven/inc目录下,后两个文件在主题根目录

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:由于完整贴代码导致页面错乱故把:<去掉

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

mobile.css

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

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

给TA买糖
共{{data.count}}人
人已赞赏
WordPress

WordPress主题:Modown v1.7

2019-3-9 14:03:55

WordPress

WordPress主题:博客二号 v1.0.2

2019-3-12 11:54:10

0 条回复 A文章作者 M管理员
    暂无讨论,说说你的看法吧
个人中心
购物车
优惠劵
搜索