王桂明在參考分享張戈博客的在線影音源代碼,根據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.zdlbgm.tw/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.zdlbgm.tw/feed