王桂明在参考分享张戈博客的在线影音源代码,根据wordprss特点,修改源码并成功调试成功。如图:

worperss增加在线影音,分享在线影音源码

worperss增加在线影音,分享在线影音源码

下面是制作方法:

1、先把下面代码另存为online.php,并上传到主题目录

<?php
/*
Template Name: 在线影音
*/
?>
<html>
<head>      
<title>在线影音|王桂明's Blog | 杰创官方博客</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="Keywords" content="王桂明's Blog,在线音乐,百度随心听,音乐电台,在线电视直播,在线电视剧观看,免费在线电视剧,网络电视直播,网络电视在线直播">
<meta name="description" content="王桂明's Blog的在线音乐,百度随心听,音乐电台,在线电视直播,在线电视剧观看,免费在线电视剧,网络电视直播,网络电视在线直播页面">
<style type="text/css">
html,body{height:100%;overflow:hidden}body{font:13px/27px '微软雅黑',Arial,sans-serif;padding:0;margin:0}a{text-decoration:none;cursor:pointer}a:hover{text-decoration:underline}#nav{color:#fff;background:#333;height:30px;line-height:30px}#nav .main{width:auto;margin:0 auto}#nav a,#nav span{margin-right:5px;color:#ccc}#nav a{margin-right:10px}#nav a:hover{color:#fff;text-decoration:none}#nav a.on,#nav a.on:hover{font-weight:bold;color:#fff}
</style>
<script type="text/javascript" src="<?php bloginfo('template_directory'); ?>/js/jquery.min.js" ></script>
 
<script type="text/javascript">
     jQuery(function() {
        jQuery('a').click(function() {
        	jQuery(this).attr('class', 'on').siblings().removeAttr('class');
        		jQuery('#online').attr('src', jQuery(this).attr('data'));
        		//jQuery('title').html(jQuery(this).html() + '|王桂明博客');
        		 });
        });
        </script>
 
 </head>
    <body>
	<div id="nav">
	<div class="main">
                <a href="<?php bloginfo('home'); ?>" target="_blank">&nbsp; &nbsp; &nbsp;<span style="font-weight: 600;color: #82D900">★<?php bloginfo('name'); ?>首页★</span></a>
 
	   <span style="font-weight:600;color: #00DB00">&nbsp; 网络电视:</span>
            <a data="http://tv.sohu.com/feihulivebox4/">搜狐电视</a>
            <a data="http://live.64ma.com/tv/live.html">64码网络电视</a>
            <a data="http://www.cietv.com/images/img/100">易视直播</a>					
            <span style="font-weight:600;color: #FF0080">&nbsp; 音乐电台:</span>
            <a data="http://www.dongting.com/" class="on">天天动听</a> 
            <a data="http://fm.baidu.com/">百度随心听</a>
	    <a data="http://fm.qq.com/">QQ电台</a>
	    <a data="http://www.9ku.com/fm/">九酷电台</a>
            <a data="http://www.kugou.com/fmweb/html/index.html">酷狗音乐</a>
            <a data="http://player.kuwo.cn/webmusic/play">酷我音乐</a>
            <a data="http://app.duomiyy.com/webradio/hao123/">多米音乐</a>
           <a onClick="window.external.AddFavorite('http://www.0523jz.com/online','在线影音|王桂明博客')"><span style="color: #00FFFF">&nbsp; 亲,点此收了我吧!</span></a>
	</div>
</div>
<script type="text/javascript" src="<?php bloginfo('template_directory'); ?>/js/online.js"></script>
</body>
</html>

2、上传jquery.min.js和online.js上传到主题js目录下,没有js目录,就新建一个js目录

3、新建页面,右侧的模板类型选择在线影音,别名修改为英文(比如online),点击发布。

4、访问http://你的网站/online 即可看到效果

把源码打包提供下载:

» 订阅本站: http://www.0523jz.com/feed