日誌

ClickrAdmin「編輯器」 視頻分享嵌入指南


現時有很多的瀏覽器已不支持 flash 插件,而 ClickrAdmin 編輯器內的添加視頻連結功能是以 flash 的形式展示的,導致很多使用ClickrAdmin 的網站無法正常播放視頻,因此小編為各位網站管理員整理如何在 ClickrAdmin 的編輯器內嵌入視頻:


視頻分享嵌入


實際上,很多視頻網站都提供分享通用代碼來幫助第三方嵌入它們的視頻來獲取更多的瀏覽量或點擊率,而小編也發現大部分的視頻網站,如 YouTube、YOUKU、Facebook、騰訊視頻、愛奇藝、搜狐視頻和 B 站等等視頻分享嵌入的方式操作都是一樣的,所以下面小編主要以 YOUKU 視頻的分享嵌入為例說明下大致的嵌入步驟:


1

打開需要插入的視頻連結,點擊【分享】按鈕:


106-1.png

 

2


在顯示的分享內容裡面,點擊【複製通用代碼】,有些視頻分享可能沒明確說明“通用代碼”,此時可複製帶有” iframe ”字樣的內容即可:


106-2.png


3


複製完成後,回到 Clickradmin 後台編輯器,點擊左上角的【HTML】進入源代碼編輯:


106-3.png


4


然後在對應需要擺放的位置帶有“< / p >”代碼後面回車換行後,粘貼嵌入代碼:


106-4.png


5


粘貼成功後,需要再次點擊編輯器左上角的【HTML】回到內容編輯,可以在裡面看到 YOUKU 視頻的嵌入效果,YOUKU 視頻嵌入時自帶設定了的寬高,所以在編輯器內會看到只有一半的內容,請放心,這個不會影響顯示的效果的。確認嵌入視頻無誤後,點擊右上角的【儲存】,即可成功嵌入視頻: 


106-5.png


前台效果展示:


106-6.png


該方法對於有一點編程基礎的管理員來講是比較好理解,而對於沒有編程基礎的管理員來講都不會太複雜,只需要按照上面說明的操作步驟來進行即可,每個視頻網站的操作都大同小異,只需找到帶有 iframe 的代碼內容再按步驟粘貼到 ClickrAdmin 後台編輯器即可成功嵌入視頻。


注意事項

第一點

小編發現 Facebook 視頻分享嵌入針對了豎版的分享並不太友好。直接分享本身是豎屏的視頻時,由於嵌入代碼裡自帶了優先級 100% 的寬度(width),所以就算粘貼到 ClickrAdmin 編輯器裡面查看的效果是正常的:


106-7.png


但點擊儲存後的結果展示都會以 100% 的寬度顯示,嵌入代碼本身又帶有寬(width)和高(height),在寬度(width)100% 展示而高度(height)固定的情況下,點擊播放視頻時就只會顯示該高度(height)的視頻內容,不會顯示完整範圍的視頻。


106-8.png


如果想要完整顯示視頻的內容,就需要在“嵌入視頻”彈框上點擊裡面的【高級設置】按鈕直接去到“Facebook for Developers”開發文檔:


106-9.png


在“Facebook for Developers”開發文檔裡找到【獲取代碼】按鈕,點擊獲取嵌入代碼:


106-10.png


在彈出的彈框內選擇【 iframe 】,選中框內的< iframe >代碼內容複製後去到 Clickradmin 後台編輯器按照分享嵌入視頻的方式粘貼代碼即可嵌入 Facebook 完整的視頻:


106-11.png


最終結果顯示:


106-12.jpg


Facebook 的視頻分享嵌入,視頻本身是橫屏的話就還好,但視頻本身是豎屏的話,就只能按照上面的那個方式嵌入才可以顯示完整的視頻內容。如果覺得太高的話,小編建議重新找橫屏的視頻嵌入。


第二點

還有就是視頻分享嵌入的 iframe 代碼粘貼後都自帶固定寬(width)和高(height),而 ClickrAdmin 編輯器內設定的樣式是最高級(即優先在網站上顯示)的,因此設定了固定寬度(width)的話,在寬度小於視頻設置寬度(width)的智慧手機上查看視頻,視頻就會溢出屏幕,顯示不全。


106-13.png


此時就需要網站管理員手動更改寬度(width)的值,高度則無須修改。為了更好的適應不同屏幕的智慧手機,小編建議將寬度(width)設置成 100% 即[ width=”100%” ],代碼的編寫要在英文的輸入模式下編寫才有效果。Facebook 的視頻自帶 100% 的寬度(width)顯示,可不做此操作。


106-14.png


第三點

還有一些視頻網站不支持第三方使用它的嵌入代碼,比如土豆、芒果TV等,只能透過它支持的分享方式進行分享,無法通過嵌入代碼來獲取視頻內容,這也是視頻網站的一些限制。就目前來說,小編暫時也找不到解決方案。


106-15.png


現在大部分的視頻網站都支持透過 iframe 代碼來嵌入視頻,但也有個別的視頻網站不支持此方式嵌入視頻。小編希望視頻分享嵌入的方法能幫助到各網站管理員。


回最頂