AMZ123跨境卖家导航
拖动LOGO到书签栏,立即收藏AMZ123
首页跨境头条文章详情

独立站嵌入的youtube视频手机端无法自适应,怎么办?

8887
2021-10-08 03:10
2021-10-08 03:10
8887

在做独立站的过程中,市面上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>


    免责声明
    本文链接:
    本文经作者许可发布在AMZ123跨境头条,如有疑问,请联系客服。
    最新报告作者标签
    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万亿美元,显示出系统性风险的持续扩大。在各类欺诈行为中,信用卡欺诈是损失最为集中的领域。
    跨境学院
    跨境电商大小事,尽在跨境学院。
    AMZ123选品观察员
    选品推荐及选品技巧分享。
    北美电商资讯
    AMZ123旗下北美跨境电商新闻栏目,专注北美跨境电商热点资讯,为广大卖家提供北美跨境电商最新动态、最热新闻。
    AMZ123星球
    「AMZ123会员」为出海者推出的一站式私享服务
    跨境科普达人
    科普各种跨境小知识,科普那些你不知道的事...
    侃侃跨境那些事儿
    不侃废话,挣钱要紧!
    亚马逊资讯
    AMZ123旗下亚马逊资讯发布平台,专注亚马逊全球热点事件,为广大卖家提供亚马逊最新动态、最热新闻。
    亚马逊全球开店
    亚马逊全球开店官方公众号,致力于为中国跨境卖家提供最新,最全亚马逊全球开店资讯,运营干货分享及开店支持。
    首页
    跨境头条
    文章详情
    热门活动
    跨境资讯
    跨境资讯
    跨境早报
    跨境社群
    品类交流群
    宠物品类交流群
    宠物品类交流群
    加入
    宠物品类交流群
    扫码进群
    家居品类交流群
    家居品类交流群
    加入
    家居品类交流群
    扫码进群
    母婴用品交流群
    母婴用品交流群
    加入
    母婴用品交流群
    扫码进群
    品类交流群
    加入
    跨境资料
    亚马逊运营干货包
    亚马逊运营干货包
    加入
    亚马逊运营干货包
    扫码进群
    TikTok运营干货包
    TikTok运营干货包
    加入
    TikTok运营干货包
    扫码进群
    跨境电商行业报告
    跨境电商行业报告
    加入
    跨境电商行业报告
    扫码进群
    跨境资料
    加入
    官方社区
    跨境电商交流群
    跨境电商交流群
    加入
    跨境电商交流群
    扫码进群
    亚马逊卖家交流群
    亚马逊卖家交流群
    加入
    亚马逊卖家交流群
    扫码进群
    独立站卖家交流群
    独立站卖家交流群
    加入
    独立站卖家交流群
    扫码进群
    官方社区
    加入
    AMZ123官方客服二维码1
    立即扫码咨询
    AMZ123官方客服二维码2
    立即扫码咨询
    咨询
    官方微信群
    官方客服

    扫码添加,立即咨询

    加群
    官方微信群
    官方微信群

    扫码添加,拉你进群

    更多
    订阅号服务号跨境资讯
    二维码

    为你推送和解读最前沿、最有料的跨境电商资讯

    二维码

    90% 亚马逊卖家都在关注的微信公众号

    二维码

    精选今日跨境电商头条资讯

    回顶部