全屏海报代码-淘宝首页全屏图片效果是怎么做出来的。

方法/步骤

第一,先到百度上搜索“淘宝全屏海报代码”,出现很多提供的。随便点一个在线生成的。

请点击输入图片描述

第二,在海报宽度后面的框中输入全屏宽度,比如1920,再输入高度,比如600,选择链接打开方式是在原本的窗口还是另弹出窗口,选择店铺类型,再把设置好的全屏海报图片上传到淘宝的图片空间,把图片的链接网址复制过来粘贴到“图片链接”后的框里。再复制对应的商品售卖链接粘贴到“宝贝链接”的框里。点击“预览”,上方就会出现预览图

请点击输入图片描述

第三,觉得可以了,就点击“获取代码”,下方就出现生成的代码,选中右击复制。

请点击输入图片描述

请点击输入图片描述

第四,到店铺装修的布局管理里“添加布局单元",950px的。再于右侧的“+”按住拉到导航下方

请点击输入图片描述

请点击输入图片描述

请点击输入图片描述

第五,再从左侧拉“自定义区”到该布局上。回到页面编辑。

请点击输入图片描述

请点击输入图片描述

第六,对着自定义区右上方的编辑点击,再点击“<->”按钮,右键粘贴刚才复制的代码。按确定就OK了。记得要发布页面。

请点击输入图片描述

请点击输入图片描述

1、打开记事本把这代码复制粘贴在内做准备,也可用直接店铺装修的自定内容区。为了更好的看效果这用记事本。

<div style="height:600px;margin-top:0px;margin-bottom:0px;margin-left:0px;margin-right:0px;">

<div class="footer-more-trigger" style="left:50%;top:auto;border:none;padding:0;">

<div class="footer-more-trigger" style="left:-960px;top:auto;border:none;padding:0;">

<a href="连接地址" target="_blank" style="width:1920px;height:600px;display:block;"> <img src="图片链接地址" style="border:none;" /></a>

</div>

</div>

</div>

2、现在修改代码链接地址,到卖家中心复制商品链接地址粘贴覆盖链接地址。再到空间复制海报链接地址覆盖图片链接地址,复制好待用,效果如图。

3、进入店铺装修添加个自定义内容区。

4、添加完成后点击编辑,在显示标题选择不显示。点击<>编辑源代码,将复制好的代码粘贴里面,点击确定完成。

5、最后再介绍一下代码位置与修改。海宽用1920px。高度400到600像素不等。修改代码高要和海报图片一样。

6、再看一下自定义内容区高度设置效果对比。

7、一切设置好,预览没发现问题,就点击发布。

1、首先请做好宽屏海报大图上传到图片空间,然后进入卖家中心查看和编辑淘宝店铺首页。

2、点击左侧的模块,选择自定义模块拖到右边的编辑区放好。

3、点击自定义模块右上角的编辑按钮打开对话框,显示标题栏选择不显示,点击最下面编辑源代码。

4、在图片空间找到你上传的宽屏海报复制链接地址。

5、在代码区填好代码。代码如下:

1920px全屏海报:(宽度1920px,高度随便自己调,记得修改两处的500px,自己做的海报高度是多少就改成多少)

<divstyle="height:500px;">??

<divclass="footer-more-trigger"style="left:50%;top:auto;border:none;padding:0;">???

<divclass="footer-more-trigger"style="left:-960px;top:auto;border:none;padding:0;">???

<ahref=""target="_blank"style="width:1920px;height:500px;display:block;">???????

<imgsrc=""border="0"alt="全屏海报"/></a></div>???

</div>??

</div>

</div>

宽度最宽为1920,高度可以自己调整,(<imgsrc=""border="0"alt="全屏海报"/></a></div>)这个地方?号换成你自己的图片空间复制的地址。

6、点击确定后,即可以看到宽屏海报图片已经在自定义区的位置了,即大功告成,下面的卡通图片来自百度搜索的素材。