Shopify怎么插入视频?在Shopify产品页面上传视频或者插入Youtube视频/Vimeo视频的4种方法

新注册Shopify账户可获得 14 天免费使用优惠 – 立即注册账户获取

Shopify怎么插入视频?如何在Shopify产品页面插入视频? Shopify最近的一次重要的系统更新,将产品添加/编辑页面原来的“Images”板块,修改为了“Media”板块,当然,改掉的不仅仅是一个单词,在“Media”板块的右上角还可以看到“Add Media from URL”的选项,在下拉菜单中可以看到 Embed Youtube Video的选项,意味着Shopify系统目前已经支持在产品图片展示区域添加Youtube视频。相比较于图片来说,视频可以对产品的外观功能等信息进行更加丰富和全面的展示,进而提高我们Shopify独立站的转化率,在我关注的Shopify网站里面,不少都已经在产品图片的位置添加了视频,如下图 K9 Ballistics 这个品牌的Shopify网站通过视频所展示的Dog Bed产品信息。

Shopify怎么插入视频?在Shopify产品页面插入视频的4种方法

Shopify添加视频的4中操作方法:

Shopify怎么插入视频?Shopfiy详情页中加入视频

最简单的办法,也是所有Shopify网站,不管你使用的是什么主题,都可以实现的一个方法,就是先把你要插入到Shopify产品详情页的视频制作好,然后再上传到Youtube网站,在Youtube网站上获取到视频嵌入代码,再将代码粘贴到Shopify产品描述中即可。具体操作如下:

将你的视频制作好之后上传到Youtube,等待上传审核成功之后,打开视频页面,右击视频界面选择“复制嵌入代码”的选项,或者点击视频底部的“分享”按钮,然后选择“嵌入”选项,在弹窗视频中,将“嵌入视频”代码复制下来。

将Youtube视频插入到Shopify

打开你Shopify网站需要插入视频的产品编辑页面,点击编辑框中右上角的“<>”按钮,将编辑框切换到代码编辑器界面,然后在合适的位置插入我们刚刚复制的代码即可。如下图所示。

保存修改,然后在网站前台产品页面就可以看到并且播放我们刚刚插入的Youtube视频

这种做法有一个非常不好的体验在于,当该视频播放完毕之后,会有相关视频推荐来吸引用户继续观看视频,而这些相关视频推荐背后是一套强大的推荐算法,也就意味着,当用户看完你的独立站上的视频之后,可能就被Youtube给带着到Youtube网站上或者APP上了。等到用户看完了一个又一个视频之后,可能已经忘记最一开始的时候要干嘛来着,或者已经没有了购物的欲望了。

之前网上有不少教程可以教你修改Youtube的嵌入代码,来取消掉视频中的广告弹窗以及视频结尾的相关视频推荐,我亲测了几个教程中的方法,发现这些做法都已经失效。

不过如果你的视频数量不是很多,你可以将视频上传到Vimeo,Wistia等视频网站,然后使用同样的方法获取代码将视频插入到Shopify产品详情描述中,这些视频网站不会像Youtube一样插入广告或相关视频推荐,当然,Vimeo,Wistia对视频的数量以及视频文件的大小,时长等等是有限制的,你可以通过付费来解锁限制。上面截图中 K9 Ballistics 的产品视频就是托管在Vimeo上面的。

 

直接将视频通过Media上传插入到产品页面

如果你不想将视频上传到产品描述中,也可以直接将视频上传到产品图片展示的位置。Shopify在3月份完成系统更新之后,将产品上传页面的Image选项改为Media选项,在原来上传产品图片功能基础上,支持直接上传视频到Shopify系统中。并且点击下图右上角的Add media from URL,可以直接调用Youtube的视频。

Shopify系统更新之后,后台的 Images 板块更改为 Media

点击 下图虚线框中的 Add media or drop files to upload 区域,也可以直接将你电脑本地上的视频上传到Shopify系统中,并将该视频添加到网站前台产品页面产品图片展示区域。上传成功的视频,在右下角会有一个黑色背景的播放按钮。

你可以通过Media将本地视频直接上传到Shopify后台并展示在前台

Media板块的更新,除了支持图片和视频之外,还支持插入3D模型。如下图所示,下图动态内容并不是一个视频,而是我使用鼠标拖拽产品3D模型的同时,使用GIPHY录制的一个GIF动图(你可以通过这条链接实际体验下产品3D模型的魅力 – https://debut-theme-default.myshopify.com/products/studio-bag)。通过3D模型,客户可以使用放大,拖拽等操作更全面细致的了解产品细节,对我们卖家来说,当然更有利于提高网站的转化率。

Debut演示主题展示的产品页面 3D模型 显示样式

目前只是Shopify系统完成了更新,虽然你在后台可以添加视频和3D模型,但是还需要主题完成相应的更新之后,才能在你的网站前台展示出视频或者3D模型的内容。目前我知道的已经支持3D Models和Video的主题只有 Debut,不过相信很快大部分主题都会完成一次更新,支持在产品图片区域插入视频和3D模型。

关于图片视频 3D模型的文件格式要求和建议如下:

  • 图片文件 格式最好为 JPEG。(Shopify会自动将文件格式转化为Webp格式)。图片最大不能超过20MB,尺寸最大不能超过 4472 * 4472 px,Shopify推荐的最佳产品尺寸为 2048 * 2048 px。(Shopify会在你上传文件的时候,依据各种参数来决定是否要对文件进行压缩。)
  • 3D模型文件 格式为 GLB,文件最大为15MB,最好小于等于6MB
  • 视频文件 格式为mp4或者mov,视频清晰度最高为4K (4096 x 2160 px),文件大小不能超过 1GB,视频长度不能超过60秒。这些要求仅仅针对你上传到Shopify系统的视频,如果你是将Youtube视频插入到Shopify中,则不受上面的要求限制。

3D模型文件的制作你可以找Shopify官方的Expert帮你做,也可以去淘宝搜索服务商或者Fiverr这类的平台上发布需求。我看到的一家Shopify Expert的报价如下:

来自Spase的3D模型报价

以上报价来自于 https://spase.io/pricing

你可以看下你现在在用的主题的更新日志,或者联系主题的作者,看下主题现在是否已经更新,并支持在产品图片的位置插入视频或者3D模型。(注意,如果你的网站主题使用的是“盗版主题”,不建议联系主题作者,严重的可能会导致Shopify账户被封。)

将视频链接地址插入到产品图片的ALT中 (部分主题支持)

其实在Shopify更新之前,已经有不少主题支持通过将Youtube视频链接或者Vimeo的视频链接插入到图片ALT位置,来实现在产品图片位置展示视频的功能。例如我之前推荐的Shopify主题 Prestige 就是支持这一功能的。(并不是所有的Shopify主题都是支持在图片ALT中插入视频链接来支持视频功能的,建议详细阅读你的主题说明文档查找相关说明,或者联系主题作者询问主题是否支持这一功能)

  1. 首先将你制作好的视频上传到Youtube或者Vimeo
  2. 按照主题说明里面的要求复制下来Youtube视频的链接地址,或者视频的代码
  3. 将对应视频链接地址插入到图片ALT中

Prestige主题要求的是截取视频代码中的一部分内容插入到图片的ALT文本框中。例如我要把视频 https://www.youtube.com/watch?v=jzF_y039slk 插入到产品图片中,则需要打开这段视频,然后右击视频“复制嵌入代码”,或者点击分享按钮,获取嵌入代码。

<iframe src=”https://www.youtube.com/embed/jzF_y039slk” width=”560″ height=”315″ frameborder=”0″ allowfullscreen=”allowfullscreen”></iframe>

然后将上面的代码中“https://www.youtube.com/embed/jzF_y039slk”链接复制下来,插入到图片的ALT中就可以了。(注意,Prestige这个主题要求的是将嵌入代码中的视频链接地址,而不是浏览器地址栏中的链接地址,插入到图片ALT中)然后在网站前台的产品页面中就会显示如下图所示的视频播放按钮。点击播放按钮之后,就会在弹窗中播放视频内容。

你可以查看主题作者制作的如何在Prestige主题的产品图片位置插入Youtube视频的英文文字教程

个人并不是特别推荐使用Youtube视频,因为Youtube系统本身的内容推荐机制会在视频播放完成之后,推送更多相关视频来吸引观看者的注意力,点击相关内容就会跳出网站到Youtube视频中,对网站的转化形成了干扰,反而起到了负面的影响。推荐将视频上传到VIMEO,没有相关内容或者广告推送。

 

通过插件 如 EasyVideo 实现产品页面视频插入功能

如果你的主题既没有更新到最新版支持Shopify系统的视频或者3D模型,也无法在ALT中填写Youtube视频链接地址实现视频插入的功能,那么你可以试试Shopify插件,例如 EasyVideo

EasyVideo的安装使用非常的简单,视频插入方式和Prestige主题的方式很像,都是将Youtube视频或者VIMEO的视频链接地址插入到图片的ALT中来实现。其实,你可以理解为,你安装EasyVideo这个插件的同时,相当于完成了对你的主题代码的修改,让那个你的主题也支持和Prestige主题相同的视频插入方式。

EasyVideo的视频样式定制相对更灵活一些,可以自定义视频的长宽比例,视频弹窗播放还是嵌入播放,是否自动播放视频,是否在图片上展示视频播放按钮等等。另外比较赞的是,我在安装测试EasyVideo的时候发现,这一插件貌似通过某种方式屏蔽了Youtube的广告和视频推送功能,当视频播放完成之后,没有弹出显示更多视频的选项,这一点是很赞的。

如果你在安装EasyVideo这个插件之后,将Youtube视频插入到了图片ALT中,但是在前台产品页面依然无法显示视频,你就需要联系EasyVideo让他们手动帮你修改主题的代码,来实现这一功能。改代码是免费的,不过EasyVideo需要每个月3美金的费用。如果能够显著提高网站的转化率,那么这钱花的也算是超值的。

未经允许不得转载:歪猫跨境独立站博客 » Shopify怎么插入视频?在Shopify产品页面上传视频或者插入Youtube视频/Vimeo视频的4种方法

赞 (10)
新评论邮件通知
提醒
guest
3 评论
由新到旧
由旧到新 点赞最多
Inline Feedbacks
View all comments
  • 关注公众号 “ WaimaoB2C ” 第一时间获取网站最新内容,了解跨境电商独立站圈内圈外每天发生的那些事儿,和20000+独立站卖家共同成长。

    $$$$$$$$ 每月 1 本书 $$$$$$$$
    2020年8月推荐
    <The Truly Ultimate Guide To 10X Your Shopify Store> 

    公众号回复信息“ 10X ”获取本电子书下载链接。不想关注公众号的直接Google搜索书名,在搜索结果中同样可以获得电子书下载链接地址。
    该电子书不是“葵花宝典”,所以不能指望靠它“独步武林”,不过个人觉得对独立站新手来说还是有非常大的帮助的。对老手来说,实用性没那么大,不过如果电子书中有那么一两点对你的网站运营有所启发,我觉得也算是比较值了。

    *推荐亚马逊购买正版Kindle电子书或纸质书籍,获取最佳阅读体验。本分享来自于互联网以及网友上传,网站内所提供的下载链接均为站外链接,版权归原作者以及开发商所有,网站本身不存储相关资源文件. 如侵犯到版权方,请发送邮件到 hello@waimaob2c.com,站长会在第一时间删除并向您道歉。

  • Shopify 新卖家账户注册注意事项-非常重要

  • Shopify新卖家注册账户前请务必认真阅读以下注意事项:

    注册前关闭翻墙工具; 不建议使用 QQ,126,163邮箱注册账号
    打开Shopify官网 WWW.SHOPIFY.COM 获取 14 天免费使用
    注册账户时地址信息真实有效; 缴纳月租前关闭翻墙工具