zoukankan      html  css  js  c++  java
  • 【转载】博客园背景音乐调用,让音乐为你的博文加点料

     

    【转载】博客园背景音乐调用,让音乐为你的博文加点料

     

      单调的文字怎么行,让音乐为你的博文加点料。什么?你写的是技术型博客不搞这么多文艺,大叔,技术型博客也可以很文艺的诶。

      今天下三分,网易云、虾米、所有的XX音乐各占据了国内的音乐市场,不过要论曲库哪家全,网易云虾米撕破脸。所以呢,要想博客加上稳定的音乐外链,就在这两者之间选择吧。

    在网站上选择合适的背景音乐并外链

      何为“合适的背景音乐”呢?首先是前奏不要太唐突,不然网友一打开你的博客就是“咚咚咚”的声音,撸管到一半犯心脏病怎么办?其次就是曲调柔和,柔和的曲调可以使听众最大化,因为大部分人对这种音乐都不反感。做到这两点,就可以去网易云虾米上搜索选定歌曲了,当然也可以外链歌单。

      在歌曲/歌单页面下,点击“生成外链播放器”(网易)、“转帖”(虾米)就可以看到歌曲的HTML代码了。这里以歌曲 Echo 为例,展示下两种不同播放器的区别。

    <embed src="http://www.xiami.com/widget/0_1770124689/singlePlayer.swf"
     type="application/x-shockwave-flash"
     width="257"
     height="33"
     wmode="transparent">
    </embed>

    <iframe frameborder="no"
     border="0"
     marginwidth="0"
     marginheight="0"
     width=330 height=86
     src="http://music.163.com/outchain/player?type=2&id=18607260&auto=0&height=66"></iframe>

      值得注意的是,虾米使用的是 embed 而网易云则是 iframe,而 iframe 有个很大的毛病,这个网易云也有提示——“很多博客网站不支持嵌入iframe,请试一下您的网站是否支持”。这些都不重要,重要的是博客园就不支持 iframe。当然要解决也很简单,把 iframe 替换成 embed 就行了,注意前后两个标记都要替换哦,此外,既然都没有 iframe 了,自然 frameborder 也可以去掉了,结果就是:

    <embed border="0"
     marginwidth="0"
     marginheight="0"
     width=330 height=86
     src="http://music.163.com/outchain/player?type=2&id=18607260&auto=0&height=66"></embed>

      注意:auto=1 为自动播放,0为不自动播放;width 和 height 修改前面的,根据自己的博皮调整。

    将外链播放器应用在博客园首页

      这个想必大家都知道了,进入博客园设置,复制之前得到的代码添加在 页首/页脚/公告 里,刷新一下博客页面,就可以看到播放器妖娆地躺在页面上了。

    效果图(放置在公告栏)

    下面是歌曲推荐时间

     

     
     
     
  • 相关阅读:
    [Swift]LeetCode910. 最小差值 II | Smallest Range II
    转 关于shell脚本中#!/bin/bash and #!/bin/ksh 的说明
    转 对象继承
    转 PHP编程过程中需要了解的this,self,parent的区别
    转: ORA-06508 could not find program unit being called: "DBSNMP.BSLN_INTERNAL
    Multitenant best Practice clone pdb seed and Clone a Pluggable Database – 12c Edition
    Plugging an Unplugged Pluggable Database issue 3
    日历 php
    Datapatch AND What to do if the status of a datapatch action was not SUCCESS due to finding non-ignorable errors
    oracle中的用户详解 【转】
  • 原文地址:https://www.cnblogs.com/oycy0306/p/7294752.html
Copyright © 2011-2022 走看看