Blog

PC端embed方式移动端iframe方式快速插入优酷视频

前几天(差不多10天了吧,这文囧的可以……)写了《快速插入优酷视频改为 iframe 方式兼容移动设备》后,很多朋友评论说一律使用 Iframe 方式插入搜索引擎无法收录视频,对于偶尔插入分享视频的朋友来说无所谓,但如果是视频分享网站就不好了,毕竟你的内容核心是视频,而搜索引擎无法收录视频那还是很影响网站权重的。

那么就再 YY 一下(网上应该有很多类似教程了),我共享一下帮一个朋友做主题时写的这功能的代码吧,我用以前收藏的移动端判断函数来实现根据使用环境决定使用 embed 还是 iframe。

懒得具体说明了,直接上代码吧,里面有注释:另外这次的代码我特意修改做了兼容,支持任何语言的 WordPress

代码实现 PC 端 embed 方式移动端 iframe 方式快速插入优酷视频功能

1. 在 functions.php 插入以下代码(有些代码[如判断是否mobile]收录自搜索,源自哪里已无从考证——好吧,我忘了,如果你是原创作者请联系我)
注:凡是加入主题的 functions.php 里面的代码都要放在 <php ?> 里面】

//判断是否移动设备 Modify by zwwooooo | zww.me
function zfunc_is_mobile() {
	$user_agent = $_SERVER['HTTP_USER_AGENT'];
	$mobile_agents = Array("240x320","acer","acoon","acs-","abacho","ahong","airness","alcatel","amoi","android","anywhereyougo.com","applewebkit/525","applewebkit/532","asus","audio","au-mic","avantogo","becker","benq","bilbo","bird","blackberry","blazer","bleu","cdm-","compal","coolpad","danger","dbtel","dopod","elaine","eric","etouch","fly ","fly_","fly-","go.web","goodaccess","gradiente","grundig","haier","hedy","hitachi","htc","huawei","hutchison","inno","ipad","ipaq","ipod","jbrowser","kddi","kgt","kwc","lenovo","lg ","lg2","lg3","lg4","lg5","lg7","lg8","lg9","lg-","lge-","lge9","longcos","maemo","mercator","meridian","micromax","midp","mini","mitsu","mmm","mmp","mobi","mot-","moto","nec-","netfront","newgen","nexian","nf-browser","nintendo","nitro","nokia","nook","novarra","obigo","palm","panasonic","pantech","philips","phone","pg-","playstation","pocket","pt-","qc-","qtek","rover","sagem","sama","samu","sanyo","samsung","sch-","scooter","sec-","sendo","sgh-","sharp","siemens","sie-","softbank","sony","spice","sprint","spv","symbian","tablet","talkabout","tcl-","teleca","telit","tianyu","tim-","toshiba","tsm","up.browser","utec","utstar","verykool","virgin","vk-","voda","voxtel","vx","wap","wellco","wig browser","wii","windows ce","wireless","xda","xde","zte");
	$is_mobile = false;
	foreach ($mobile_agents as $device) {
		if (stristr($user_agent, $device)) {
			$is_mobile = true;
			break;
		}
	}
	return $is_mobile;
}

//// 如果 WordPress 不是中文版,增加优酷视频自动插入 Modify by zwwooooo | zww.me
if (get_bloginfo('language') != 'zh-CN') {
	function wp_embed_handler_youku( $matches, $attr, $url, $rawattr ) {
		// If the user supplied a fixed width AND height, use it
		if ( !empty($rawattr['width']) && !empty($rawattr['height']) ) {
			$width  = (int) $rawattr['width'];
			$height = (int) $rawattr['height'];
		} else {
			list( $width, $height ) = wp_expand_dimensions( 480, 400, $attr['width'], $attr['height'] );
		}
	  $embed = sprintf(
	    '<embed src="http://player.youku.com/player.php/sid/%1$s/v.swf" allowFullScreen="true" quality="high" width="'. esc_attr($width) .'" height="'. esc_attr($height) .'" align="middle" allowScriptAccess="always" type="application/x-shockwave-flash"></embed>',
	    esc_attr( $matches['video_id'] ) );

	  return apply_filters( 'embed_youku', $embed, $matches, $attr, $url, $rawattr );
	}
	wp_embed_register_handler( 'youku', 
	  '#https?://v\.youku\.com/v_show/id_(?<video_id>[a-z0-9_=\-]+)#i', 
	  'wp_embed_handler_youku' );
}

//// 对移动端的视频使用 iframe 方式插入 by zwwooooo | zww.me
if( zfunc_is_mobile() ){
	//// 如果 WordPress 是中文版,移除原来的 youku 视频代码自动插入
	if (get_bloginfo('language')==='zh-CN')
		wp_embed_unregister_handler( 'youku' );

	//// 增加 iframe 方式的视频调用
	function wp_iframe_handler_youku( $matches, $attr, $url, $rawattr ) {
		// If the user supplied a fixed width AND height, use it
		if ( !empty($rawattr['width']) && !empty($rawattr['height']) ) {
			$width  = (int) $rawattr['width'];
			$height = (int) $rawattr['height'];
		} else {
			list( $width, $height ) = wp_expand_dimensions( 480, 400, $attr['width'], $attr['height'] );
		}
		$iframe = '<iframe width='. esc_attr($width) .' height='. esc_attr($height) .' src="http://player.youku.com/embed/'. esc_attr($matches[1]) .'" frameborder=0 allowfullscreen></iframe>';
		return apply_filters( 'iframe_youku', $iframe, $matches, $attr, $url, $ramattr );
	}
	wp_embed_register_handler( 'youku_iframe', '#http://v.youku.com/v_show/id_(.*?).html#i', 'wp_iframe_handler_youku' );
}

2. 用法:直接把优酷视频地址粘贴到文章内容里面,注意要独占一行

-------------

继续玩手机去~最近刷机刷狂了~

哦,我喜欢上那些带 HALO 的 ROM 了……

-------------

2013.7.22 更新:在评论中,大发提醒 WordPress 已经内置了移动设备判断函数 wp_is_mobile(),这是 WordPress 3.4 增加的,我没注意,所以代码可以精简成:

//// 如果 WordPress 不是中文版,增加优酷视频自动插入 Modify by zwwooooo | zww.me
if (get_bloginfo('language') != 'zh-CN') {
	function wp_embed_handler_youku( $matches, $attr, $url, $rawattr ) {
		// If the user supplied a fixed width AND height, use it
		if ( !empty($rawattr['width']) && !empty($rawattr['height']) ) {
			$width  = (int) $rawattr['width'];
			$height = (int) $rawattr['height'];
		} else {
			list( $width, $height ) = wp_expand_dimensions( 480, 400, $attr['width'], $attr['height'] );
		}
	  $embed = sprintf(
	    '<embed src="http://player.youku.com/player.php/sid/%1$s/v.swf" allowFullScreen="true" quality="high" width="'. esc_attr($width) .'" height="'. esc_attr($height) .'" align="middle" allowScriptAccess="always" type="application/x-shockwave-flash"></embed>',
	    esc_attr( $matches['video_id'] ) );

	  return apply_filters( 'embed_youku', $embed, $matches, $attr, $url, $rawattr );
	}
	wp_embed_register_handler( 'youku', 
	  '#https?://v\.youku\.com/v_show/id_(?<video_id>[a-z0-9_=\-]+)#i', 
	  'wp_embed_handler_youku' );
}

//// 对移动端的视频使用 iframe 方式插入 by zwwooooo | zww.me
if( wp_is_mobile() ){
	//// 如果 WordPress 是中文版,移除原来的 youku 视频代码自动插入
	if (get_bloginfo('language')==='zh-CN')
		wp_embed_unregister_handler( 'youku' );

	//// 增加 iframe 方式的视频调用
	function wp_iframe_handler_youku( $matches, $attr, $url, $rawattr ) {
		// If the user supplied a fixed width AND height, use it
		if ( !empty($rawattr['width']) && !empty($rawattr['height']) ) {
			$width  = (int) $rawattr['width'];
			$height = (int) $rawattr['height'];
		} else {
			list( $width, $height ) = wp_expand_dimensions( 480, 400, $attr['width'], $attr['height'] );
		}
		$iframe = '<iframe width='. esc_attr($width) .' height='. esc_attr($height) .' src="http://player.youku.com/embed/'. esc_attr($matches[1]) .'" frameborder=0 allowfullscreen></iframe>';
		return apply_filters( 'iframe_youku', $iframe, $matches, $attr, $url, $ramattr );
	}
	wp_embed_register_handler( 'youku_iframe', '#http://v.youku.com/v_show/id_(.*?).html#i', 'wp_iframe_handler_youku' );
}

OK,WordPress 真是无孔不入啊,牛x到很多人都不用了转用其他偏门或者小型的博客系统——这神马逻辑?

zww
or
oooo

声明: 除非注明,ZWWoOoOo文章均为原创,转载请以链接形式标明本文地址
本文地址: https://zww.me/wordpress-easy-insert-youku-embed-iframe.z-turn

58 comments

  1. 自由人 自由人 Google Chrome 28 Google Chrome 28 Windows 7 Windows 7

    这功能不错~~ 前两天还在想手机上的视频怎么搞

    沙发
  2. cangzhang cangzhang Google Chrome 27 Google Chrome 27 Mac OS X 10.8 Mac OS X 10.8

    不错~学习咯

    板凳
  3. 小周博客 小周博客 Google Chrome 29 Google Chrome 29 Windows 7 Windows 7

    来站个作为

    地板
  4. ......
  5. 周周 周周 Google Chrome 21 Google Chrome 21 Windows 7 Windows 7

    embed 这部分代码换了怎么没有用

    21楼
  6. 木木 木木 Google Chrome 26 Google Chrome 26 Windows 7 Windows 7

    //// 增加 iframe 方式的视频调用

    function wp_iframe_handler_youku( $matches, $attr, $url, $rawattr ) {

    // If the user supplied a fixed width AND height, use it

    if ( !empty($rawattr['width']) && !empty($rawattr['height']) ) {

    $width = (int) $rawattr['width'];

    $height = (int) $rawattr['height'];

    } else {

    list( $width, $height ) = wp_expand_dimensions( 480, 400, $attr['width'], $attr['height'] );

    }

    $iframe = '';

    return apply_filters( 'iframe_56com', $iframe, $matches, $attr, $url, $ramattr );

    }

    wp_embed_register_handler( '56com_iframe', '#http://www.56.com/u72/v_(.*?).html#i', 'wp_iframe_handler_56com' );

    } 请问 什么地方不对

    22楼
    • 木木 木木 Google Chrome 26 Google Chrome 26 Windows 7 Windows 7

      @木木
      我知道了

    • zwwooooo zwwooooo Firefox 25 Firefox 25 Windows 8.1 Windows 8.1

      你这么一贴啥也不说明我都不知道你到底要问啥问题就木有回复了。

  7. 木木 木木 Google Chrome 26 Google Chrome 26 Windows 7 Windows 7

    上面代码 以前怎么都不对 现在优酷 土豆 56 都好了

    23楼
  8. fish1725 fish1725 Google Chrome 32 Google Chrome 32 Windows 7 Windows 7

    wp_oembed_add_provider( 'http://v.youku.com/v_show/*', 'http://player.youku.com/embed' );
    这样就可以了

    24楼
  9. hellozww hellozww Firefox 27 Firefox 27 Windows 7 Windows 7

    你好,最好也讲一下,用这种方法怎么使得视频自适应调节呢?css判断吗

    25楼
  10. yiheltcp yiheltcp Firefox 27 Firefox 27 Windows 7 Windows 7

    56网的真是依葫芦画不了瓢啊 因为56的url有些东西不是随机的,比如http://www.56.com/u79/v_OTM2MDgxMzI.html这里面u79都是变化着的,怎么搞都不行,代码盲啊 都好几个小时了,抓狂,zww,恳请指点一下吧,非常感谢

    26楼
    • zwwooooo zwwooooo Firefox 27 Firefox 27 Windows 8.1 Windows 8.1

      @yiheltcp
      对56无爱,不折腾,你搜下看看有没有其他人已经折腾好了。

    • yiheltcp yiheltcp Firefox 27 Firefox 27 Windows 7 Windows 7

      @zwwooooo
      关键56的广告时间非常短呢 优酷、土豆动不动就给你来个30多秒 我网上找了一个上午,没看见谁弄,就连优酷的也是你这边首发啊,其他的地方都是转载你的 貌似只有你弄了,外面才会有,不然就算再过一年也没人弄这么好的东西,所以你有空就弄弄呗,不知道有多少人期待呢 谢谢啊

    • zwwooooo zwwooooo Firefox 27 Firefox 27 Windows 8.1 Windows 8.1

      @yiheltcp
      不弄啊,我不太懂这些东东,记得牧风好像有折腾过,你去他博客搜搜?其实我很少去国内视频站看视频,就是因为广告,现在动不动就30秒,刷的快就直接给你1分钟的广告,气死人的。一般我都去y2b了

    • yiheltcp yiheltcp Internet Explorer 9 Internet Explorer 9 Windows 7 Windows 7

      @zwwooooo
      嗯 好的 谢谢啊

  11. Jerome Jerome Safari 8 Safari 8 Mac OS X 10.10 Mac OS X 10.10

    如何如何强制插入视频的宽、高为480 400?
    不用这个判定
    // If the user supplied a fixed width AND height, use it
    if ( !empty($rawattr['width']) && !empty($rawattr['height']) ) {
    $width = (int) $rawattr['width'];
    $height = (int) $rawattr['height'];
    } else {
    list( $width, $height ) = wp_expand_dimensions( 480, 400, $attr['width'], $attr['height'] );
    }

    27楼

Leave a Reply