網(wǎng)站文章添加視頻的幾種方法

有時(shí)候我們可能需要在網(wǎng)站文章內(nèi)容中插入視頻，那么需要怎么操作呢？今天悅?cè)痪W(wǎng)絡(luò)工作室就給大家介紹幾種視頻的插入方式。

注：演示環(huán)境為wordpress，古騰堡編輯器。其它網(wǎng)站程序方法類似。

方法一：直接上傳

新建文章，新建一個(gè)區(qū)塊，選“視頻”。

然后點(diǎn)“上傳”，在本地電腦上選擇一個(gè)視頻上傳。這樣視頻會(huì)直接上傳到網(wǎng)站服務(wù)器中。

本地上傳的效果如上圖所示。這種方法的好處是方便直接，而且沒有廣告，畫質(zhì)可控；壞處則是比較耗費(fèi)服務(wù)器資源，會(huì)拖慢網(wǎng)站速度，而且有些企業(yè)網(wǎng)站模板可能會(huì)出錯(cuò)。

所以一般情況下我們不推薦這種方法。

方法二：嵌入視頻代碼

大多數(shù)情況下我們都會(huì)把視頻先上傳到視頻網(wǎng)站，這里我們以騰訊視頻為例。首先我們要把視頻上傳到騰訊視頻。

視頻審核成功之后打開它，在播放界面找到“分享”，然后點(diǎn)“復(fù)制通用代碼”。

然后新建區(qū)塊，選“HTML”。

然后把前面復(fù)雜的代碼粘貼到上面的窗口中，然后點(diǎn)“預(yù)覽”

發(fā)布文章之后就可以看到效果了，如上圖所示。

這種方法的好處是不會(huì)占用網(wǎng)站服務(wù)器資源，不會(huì)影響服務(wù)器性能和網(wǎng)站速度，效果也不錯(cuò)。壞處則是播放時(shí)可能會(huì)出現(xiàn)廣告。

方法三：使用短代碼

這里分享一個(gè)新主題大胡子的代碼：

*/
function dahuzi_qq_video($atts, $content=null) {
    extract(shortcode_atts(array("vids" => ''), $atts));
    $url = 'https://vv.video.qq.com/getinfo?vids='.$vids.'&platform=101001&charge=0&otype=json';
    $json = file_get_contents($url);
    preg_match('/^QZOutputJson=(.*?);$/',$json,$json2);
    $tempStr = json_decode($json2[1],true);
    $vurl = 'https://ugcws.video.gtimg.com/'.$tempStr['vl']['vi'][0]['fn']."?vkey=".$tempStr['vl']['vi'][0]['fvkey'];
  	$video = '<video style="width: 100%;" controls src="'.$vurl.'" poster="https://puui.qpic.cn/qqvideo_ori/0/'.$vids.'_496_280/0"></video>';
  
    return $video;
}
add_shortcode('qq-video', 'dahuzi_qq_video');

把上面的代碼添加到當(dāng)前主題的functions.php文件中，然后保存。

接下來新建區(qū)塊，添加“短代碼”。短代碼的格式為：

比如你的視頻鏈接：https://v.qq.com/x/page/a3885n7vk73.html，最后那部分就是ID，即a3885n7vk73

所以我們輸入如上短代碼就可以了。

文章發(fā)布之后我們就可以看到效果了，如上圖所示。這種方法的好處是方便，不占用服務(wù)器資源，不影響速度，而且沒有廣告；壞處則是插入的視頻可能默認(rèn)清晰度比較低，而且不能調(diào)整。

注：該方法僅用于騰訊視頻

總結(jié)

以上幾種方法各有優(yōu)劣，大家可以根據(jù)情況自行選擇。大多數(shù)情況下，我們做企業(yè)網(wǎng)站建設(shè)都不太建議使用視頻，即使要用，也要盡量控制好數(shù)量。