独立站嵌入的youtube视频手机端无法自适应,怎么办?
2021-10-08 03:10
在做独立站的过程中,市面上SAAS模式建站都是不会允许上传比较大的视频或者是干脆不允许上传视频。自建网站的服务器带宽通常不大,放在本地服务器视频会占用很大的带宽,影响网站的整体打开速度。但在当下短视频流行的时代,在网站上加上视频的产品介绍或是评测视频有助于提高转化率。
选择全球最大的视频网站youtube用于托管视频尤其合适,方便分享传播,还能为网站带来流量,打开速度快同时还免费。
youtube视频如何嵌入独立站?
youtube嵌入的视频无法自适应怎么办?
1、还没有上传视频的先到youtube的官网点击左上角的三条横杆-->选择您的视频-->点击右上角的“创建”上传您的视频-->之后打开视频播放界面,点击分享-->嵌入-->复制代码
![]()
2、打开独立站要嵌入位置的编辑器,比如商品详情页,打开编辑器后点击HTML切换成代码模式-->粘贴刚才复制的代码,然后再点击下html切换回视图模式就可以看到youtube的视频。
![]()
3、提交后pc端效果。
![]()
手机端(移动端):我们能看到视频只显示了一半,另一半是看不到,这种情况可以通过嵌入代码解决。
![]()
4、在youtube的代码外面添加一个div模块通过代码实现自适应pc端和手机端。
![]()
效果:
![]()
附代码:
<div class="video-box"> <iframe width="560" height="315" src="https://www.youtube.com/embed/ZNziUUhjmvI" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen=""> </iframe></div><style type="text/css">.video-box{ position: relative; width: 100%; height: 0; padding-bottom: 56.25%;}.video-box iframe{ position: absolute; top: 0; left: 0; width: 100%; height: 100%;}@media screen and (max-width:800px){ .video-box{ width:100%; }}</style>最新报告作者标签
300万TEU运力被占用,亚洲港口拥堵或持续至2027年亚洲港口拥堵持续升级,全球约300万TEU集装箱船运力因延误滞留,全球船期准班率降至新低。
TikTok Shop西班牙业务年增长150%TikTok Shop的数据显示,过去12个月,TikTok Shop在西班牙的业务增长约150%,平台渗透率已经达到19%。
美客多投资9.11亿比索,新建墨西哥配送中心美客多在墨西哥哈利斯科州埃尔萨尔托投资9.11亿墨西哥比索,建设一座面积达10万平方米的新配送中心。
泰国洪灾冲击物流与电商,Shopee等平台延长发货期限此次泰国洪灾已波及全国42个府,,部分仓储园区和物流节点受到影响。Shopee、TikTok Shop和Lazada三大电商平台均推出了临时措施,主要通过延长发货期限、避免卖家因洪灾导致的延迟履约受到处罚等方式降低影响。
Neater Scooper 猫砂铲,三个美国发明专利层层设卡!一款看似简单的猫砂铲,背后藏着三件层层递进的美国发明专利。
严查升级!8万+件产品被召回,卖家别只盯着认证美国消费品安全委员会(CPSC)公布了多起召回事件,给跨境卖家提了个醒。
欧盟小包关税之后,长尾SKU才是底牌欧盟将对150欧元以下直邮小包按税目每项收3欧元临时关税,九成订单不超过50欧元的小单压力最大。关税有多少转嫁给买家、哪些商品扛得住,要看税目归类和SKU比价。卖家该怎么算包裹、定价和本地仓这笔账?2026 年 7 月 1 日,欧盟开始对价值不超过 150 欧元、直接销往欧盟消费者的进口小包裹征收临时固定关税。税额不是每件商品都收 3 欧元,而是按一个包裹中不同的关税税目计征:每种税目 3 欧元。条文很短,到了结账页面上,效果却未必一样。有的平台会把新增成本体现在商品标价里,有的可能单列进口相关费用。关税通常由卖方或进口申报方缴纳,最后有多少转嫁给买家,要看平台的定价和物流安排。
烂片才有春天?|2026国产剧出海总结我们高估了海外观众,也低估了中剧。
《跨境电商全球旺季经营增长指南》PDF下载本指南旨在帮助出海企业完善支付和结账流程,构建全球扩张基础设施准备,为黑色星期五及后续销售周期实现高转化增长夯实业务基础。
《TikTok美区出海经营方法论白皮书》PDF下载全球零售稳步攀升
未来4年全球零售市场仍将保持较稳定增长趋势,预计2024-2028年仍将保持5%左右的复合增长率,全球用户消费潜力巨大
《中国出海产业带洞察系列报告-中国小家电产业带》PDF下载当全球商业加速互联,中国出海企业正以全速之姿迈向世界。在这场波澜壮阔的全球化征程中,各大产业带正以坚实、高效的硬核供应链,成为中国制造最底气十足的后盾。
《亚马逊印度站 高潜力选品推荐》PDF下载140个重点品类:官方大数据告诉你什么产品在印度需求更大
《2026食品饮料品类出海全攻略》PDF下载国外华人数量多,与中国人口味偏好最为接近,各类零食及速食产品接受度高;偏好甜食,如巧克力饼干/水果糖等;对健康养生产品需求较大,如黑芝麻丸/刺梨干/抹茶粉/混合坚果等。
《2025中国AI企业出海系列研究:南非篇》PDF下载如今的出海道路越发不易,发达国家开始在少数高科技行业上做限制,而发展中国家则开始学习中国搞生产。双向的产业压力,再加上中国自身人口、自身市场红利的减弱,给国内企业的出海发展带来了重重阻力。在此背景下,构建“新出海”战略,选对出海目标、调整出海策略、将自身的影响力拓展到全球,是大多数出海企业急需解决的问题。
《2026 亚马逊时尚品类攻略手册》PDF下载聚焦穿着与运动生活方式产品,覆盖从日常时尚穿搭到运动装备的完整消费场景,满足消费者在不同生活方式下的功能与风格需求。
《2026跨境支付安全与增长洞察报告》PDF下载全球欺诈形势日益严峻,总体损失规模已接近5万亿美元,显示出系统性风险的持续扩大。在各类欺诈行为中,信用卡欺诈是损失最为集中的领域。

品类交流群
加入
扫码进群
加入
扫码进群
加入
扫码进群
品类交流群
加入
跨境资料
加入
扫码进群
加入
扫码进群
加入
扫码进群
跨境资料
加入
官方社区
加入
扫码进群
加入
扫码进群
加入
扫码进群
官方社区
加入
立即扫码咨询
立即扫码咨询

















