网站建设

给博客添加网络电视页面

Jager · 3月26日 · 2014年 · · 4174次已读

今天看【你的歌声】博客时,发现他有个电视直播的栏目,点进去看了下,不但节目全、缓冲快,而且还没有广告,真心不错!想到我家那位也喜欢看电视,又经常抱怨广告时间太长,怎么说我都得把它给扒过来。。。希望Alick.Li别介意,嘿嘿~

先看下效果:

张戈博客网络电视传送门:https://zhang.ge/online

既然是分享博客,那至少也要象征性的记录一下,分享下源码什么的。。。先来段这个免费网络电视的介绍:


64 码高清网络电视绿色最新版

这是一款使用 IPTV 技术实现零缓冲的高清网络电视软件,它绿色小巧,无需安装,在仅仅不到 1M 的体积里却容纳了全国几乎所有电视台直播,而且包括 CCTV5/CCTV6 等收费电视台以及高清翡翠台、美国 CNN、国家地理频道、Discovery 探索等国外频道。

特色介绍:

  • :不仅体积轻,而且系统资源占用很少;
  • :速度快,即开即播,零缓冲;无广告(貌似偶尔会有,但是只会弹一次,可以接受
  • :频道全,国内各大卫士及 CCTV 全套更有国外热门频道。
  • :支持高清播放,支持 16:9 宽屏播放。
  • 节目回看:支持 CCTV 及全省卫视回看。

界面预览:

给博客添加网络电视页面

iframe 调用

喜欢看直播的朋友肯定会留意到一些网站会有一个电视直播的链接,打开后即可在其站内观看直播,这样不仅可以为网站带来更多流量而且还保持了网站的在线时长。这便是使用 64 码高清网络电视 web 端实现的。下载地址中包含 Web 端文件,调用方法如下:

1、整体接口调用:

接口地址:http://live.64ma.com/tv/live.html

调用范例:

<script type="text/javascript">// <![CDATA[   
var w = '980'; //宽度     
var h = '551'; //高度     
var s = 'no'; //是否显示滚动条,yes 显示,no 不显示     
document.write('<iframe width='+w+' height='+h+' src="http://live.64ma.com/tv/live.html" frameborder=0 border=0 marginwidth=0 marginheight=0 scrolling='+s+'></iframe>');     
// ]]></script>

2、单独频道调用:

比如江苏卫视接口地址为:http://live.64ma.com/tv/tv.asp?pid=jiangsu

其他频道只需要替换 pid 参数值即可,pid 获取地址:http://live.64ma.com/tv/pidlist.asp

调用范例:

<iframe src="http://live.64ma.com/tv/tv.asp?pid=jiangsu" height="551" width="980" frameborder="0" marginwidth="0" marginheight="0" scrolling="no"></iframe>

3、说明:

接口地址需在 iframe 或 frameset 框架环境下使用

软件下载

如果不喜欢在网页上看,可以下载到本地观看,可用性玛思阁并未测试!


注:以上介绍摘自软件小品,原文地址:http://www.appcheers.com/64ma-tv-direct.html

自适应 iframe 代码

你的歌声》博客用的是自适应的 iframe,去掉了博客的其他模块,用户体验更棒,所以玛思阁也选择了这个 iframe 代码来制作网络电视页面:

<style type="text/css" media="screen">body{background:#000;margin:0;padding:0;}</style>   
</head>   
<body>   
<table width="100%" height="100%" border="0" align="center" cellpadding="0" cellspacing="0">   
<tbody><tr>   
<td>   
<iframe src="http://live.64ma.com/tv/live.html" height="100%" width="100%" name="mainFrame" scrolling="no" frameborder="no" marginwidth="0" marginheight="0">  
</iframe>   
</td>   
</tr>   
</tbody></table>

调用方法

下面分享一下 WordPress 博客的全屏网络电视页面简单的制作过程(非全屏的 iframe 调用方法请参考《互推联盟 iframe 代码,欢迎测试!》):

① 在主题目录下面新建一个 php 文件,比如 livetv.php;

② 粘贴以下代码并保存:

<?php           
/*   
Template Name: 网络电视
*/          
?>             
<html><head>   
<title>电视直播</title>   
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">   
<style type="text/css" media="screen">body{background:#000;margin:0;padding:0;}</style>   
</head>   
<body>   
<table width="100%" height="100%" border="0" align="center" cellpadding="0" cellspacing="0">   
<tbody><tr>   
<td>   
<iframe src="http://live.64ma.com/tv/live.html" height="100%" width="100%" name="mainFrame" scrolling="no" frameborder="no" marginwidth="0" marginheight="0">   
</iframe>   
</td>   
</tr>   
</tbody></table>   
</body></html>

③ 新建页面->自定义名称->模板下拉选择 "网络电视"->别名建议使用英文或拼音,比如 tv ->保存即可。

④ 最后将此页面添加到网站的导航菜单就大功告成啦!

Ps:其他博客程序,比如 Z-Blog 会更加简单,直接将以上代码(去掉头部 php 代码)保存为 tv.html,那网络电视地址应该就是  http://yousite/tv.html 了(请自测)。

给博客添加网络电视页面

再次感谢《你的歌声》和《软件小品》!

就说这么多,喜欢看电视的盆友记得收藏一下哦~!

48 条回应
  1. 桜満集_CA 2014-3-27 · 2:50

    好东西,收藏了,在很多网站都看到这个

    • avatar
      Jager 2014-3-27 · 7:07

      感觉还不错,就弄了一个

  2. 夏日博客 2014-3-27 · 8:13

    很有意思,但感觉弄这个东西没啥用。

    • avatar
      Jager 2014-3-27 · 8:29

      主要是我家那位喜欢看。

  3. 王英学博客 2014-3-27 · 8:30

    你就是喜欢捣腾代码啊

    • avatar
      Jager 2014-3-27 · 8:34

      [哈哈] 不折腾不幸福啊~

  4. maillot trek 2014-3-27 · 9:08

    电视链接都去哪找呢

  5. 眼幕微启 2014-3-27 · 11:05

    你这个搞得有点杂了

  6. 圆月博客 2014-3-27 · 13:09

    播放器吗,真心不错

    • avatar
      Jager 2014-3-27 · 14:19

      形式不重要,关键这个播放器用起来很不错,没广告,节目也挺全面。

  7. 三日月 2014-3-27 · 14:49

    发现比我转的那个好啊,是不是考虑换这个了 [哈哈]

    • avatar
      Jager 2014-3-27 · 15:13

      昨天晚上和我家那位看了很久,感觉不错的~~

      • 三日月 2014-3-27 · 16:13

        是的啊,还有高清啥的,我那个貌似没有高清台,我本来想弄个纯体育足球的,现在先暂时用着吧

        • avatar
          Jager 2014-3-27 · 16:15

          我这个没有湖南卫视,遗憾。。

          • 三日月 2014-3-27 · 16:31

            嘿嘿,看看能不能搞定

  8. Alick.Li 2014-3-31 · 17:43

    哇.居然有我的外链.....谢谢支持了!

    • avatar
      Jager 2014-3-31 · 19:27

      拿了你的东西,当然得链接一下嘛。

  9. 我爱集分宝 2014-4-3 · 16:04

    太赞了,我也要加一个 [赞]

    • avatar
      Jager 2014-4-3 · 16:15

      恩,留着自己看看也很不错呢~~

  10. 赚五十任务站大全30个 2014-4-7 · 17:21

    赞一个呀,这么强悍的网络播放器

  11. 渡世白玉 2014-4-7 · 21:10

    不错、、、我也加个、、哈哈、、学习了、、博主威武、、

    • avatar
      Jager 2014-4-7 · 21:15

      实际页面的源码,我已经升级,哈哈~这个文章是单一的源码,哈哈~~

      • 渡世白玉 2014-4-7 · 21:18

        不错、、这个就够用了、、自己做个自己看、、哈哈、、不用每次要看直播都搜索了、、真正精彩的节目还是全屏看的、、

        • avatar
          Jager 2014-4-7 · 21:42

          这个可以全屏看的。下方界面全屏。右上方按钮还能够画面铺满。
          如果发现有找不到的界面,可以来我这个页面看看~哈哈

          • 渡世白玉 2014-4-8 · 8:15

            好的、、、赞一个、、

  12. 电子商务文摘 2014-4-8 · 0:07

    会不会卡啊

    • avatar
      Jager 2014-4-8 · 8:37

      同等网络带宽下,我这个应该算是最快的了~~

  13. 骁-miniseo.net 2014-4-8 · 11:30

    加载这个会严重网站打开和加载速度吧?

    • avatar
      Jager 2014-4-8 · 11:59

      只是一个独立页面而已啦~你不打开那个页面,就不会去加载了。当然也不会影响整体的速度了。

  14. Anonymous 2014-4-8 · 16:52

    这个 打开是不是就会变的超慢

    • avatar
      Jager 2014-4-8 · 16:53

      这只是一个独立页面,不会影响网站整体速度。视频打开慢,是网速问题。。

  15. 从良未遂 2014-4-8 · 19:12

    这个好,我收了啊。

  16. 吴晓阳 2014-4-14 · 11:31

    哈哈,不错啊,值得分享。有机会也搞个来试试

    • avatar
      Jager 2014-4-14 · 11:41

      哈哈,这东西主要是方便自己和家人。

  17. 龙三公子 2014-4-22 · 21:56

    不错,收藏了。

  18. 微历史 2014-4-25 · 13:31

    很厉害的说。

    • avatar
      Jager 2014-4-25 · 13:49

      只是觉得很方便~哈哈

  19. qkwu 2014-5-8 · 6:50

    这个还不错

  20. OK赚吧 2014-6-18 · 5:37

    很不错,zblog代码通用。能和你的也有音乐电台栏就更爽了。

    • avatar
      Jager 2014-6-27 · 17:50

      只是你没找的而已:https://zhang.ge/3498.html

  21. 碧海神风 2014-6-27 · 15:36

    这个东西方便啊!