wordpress Shortcode自定义插入视频短代码

wordpress作为我们全球使用量最大的CMS系统,其可扩展可定制性也是前所未有的强大,短代码功能就是一种一项,由于最近常用到要插入视频的代码,一般选择的是iframe标签的代码手动插入,同时需要修改宽度和高度以匹配自己的主题,iframe代码插入的视频可以在移动端完美的加载,所以一般用这个,但不管怎样,手动添加代码加上每次都要手动修改宽度和高度,的确有点坑爹,那么短代码就是我需要的了。
需要实现的功能很简单,在添加视频的时候,我只需要将需要插入的视频地址填上就可以了,宽度和高度应该可以预设一个值,当然为了代码适用性更强,这两个值应该是可以自定义的。实现如下:
首先在function.php模板函数文件中添加以下函数:

/*Add Video Shortcode*/
function video_url($atts, $content = null) {   
extract(shortcode_atts(array("width"=>'600',"height"=>'400'),$atts));    
return'<iframe class="video" height="'.$height.'" width="'.$width.'" src="'.$content.'" frameborder=0 allowfullscreen></iframe>';
}  
add_shortcode('video','video_url');

注:代码中的class="video"是为了方便自定义CSS样式什么的,可以不要。

然后在需要插入视频的时候,首先从视频网站上得到视频的“flash地址”,然后在文章中加入代码:

[ video ]flash地址[ /video ]
去掉中括号中的空格

代码中视频的预设宽度和高度值是width="600" height="400",如果需要自定义,就用下面的代码:

[ video width="650" height="450" ]flash地址[ /video ]
去掉中括号中的空格

视频高度和宽度可以在这里自定义输入。

强调一下,这里面用到的是视频的flash地址,以优酷为例,在这里可以找到:

<a href="https://beltxman.com/wp-content/uploads/2015/07/12345_mark511.jpg"><img src="https://beltxman.com/wp-content/uploads/2015/07/12345_mark511.jpg" alt="wordpress自定义视频插入短代码" width="539" height="353" class="size-full wp-image-1197 aligncenter" /></a>

以上代码测试可以适用于与国内各大门户视频网站:优酷,土豆,爱奇艺,56,搜狐等。

5条评论

评论已关闭。