手抄报 安全手抄报 手抄报内容 手抄报图片 英语手抄报 清明节手抄报 节约用水手抄报

如何制作淘宝全屏滚动海报

时间:2024-10-30 07:58:52

1、首先把制作好的全屏海报上传到淘宝图片空间,

如何制作淘宝全屏滚动海报

2、打开淘宝网店后台装修页面,在菜单导航下面增加一个“自定义内容区”模块

如何制作淘宝全屏滚动海报

3、添加自定义内容模块后,点编辑,再点第一个工具按钮切换到代码模式。

如何制作淘宝全屏滚动海报

4、在代码模式输入下面的代码,并把图片地址和链接换成你自己的地址和链接。选择不显示标题。<div c造婷用痃lass="J_TWidget" data-widget-config="{&quot;effect&quot;: &quot;fade&quot;, &quot;circular&quot;: true ,&quot;contentCls&quot;:&quot;dm_a&quot;}" data-widget-type="Tabs" style="height:565px;"> <div class="dm_a" style="height:575px;"> <div class="footer-more footer-more-trigger" style="width:1920px;height:575px;top:auto;padding:0px;border:none;left:50%;background-color:transparent;"> <div class="footer-more footer-more-trigger" style="width:1920px;height:575px;padding:0px;border:none;left:-50%;top:-10px;background-color:transparent;"> <div data-widget-config="{&quot;easing&quot;:&quot;easeOutStrong&quot;,&quot;interval&quot;:4,&quot;navCls&quot;:&quot;dms&quot;,&quot;contentCls&quot;:&quot;dmcontent&quot;,&quot;prevBtnCls&quot;:&quot;prev&quot;,&quot;autoplay&quot;:true,&quot;nextBtnCls&quot;:&quot;next&quot;,&quot;circular&quot;:true,&quot;duration&quot;:1,&quot;activeTriggerCls&quot;:&quot;hidden&quot;,&quot;effect&quot;:&quot;scrollx&quot;,&quot;viewSize&quot;:[1920],&quot;triggerType&quot;:&quot;click&quot;}" data-widget-type="Carousel" class="J_TWidget"> <div class="J_TWidget prev" data-widget-config="{&quot;trigger&quot;:&quot;.dm_DR&quot;,&quot;align&quot;:{&quot;node&quot;:&quot;.dm_DR&quot;,&quot;offset&quot;:[-510,0],&quot;points&quot;:[&quot;cc&quot;,&quot;cc&quot;]}}" data-widget-type="Popup" style="display:none;"> <div class="prev" style="font-size:100px;cursor:pointer;"> <img src="//gdp.alicdn.com/imgextra/i2/2330940642/TB2ODLccFXXXXawXpXXXXXXXXXX_!!2330940642.png" /> </div> </div> <div class="J_TWidget next" data-widget-config="{&quot;trigger&quot;:&quot;.dm_DR&quot;,&quot;align&quot;:{&quot;node&quot;:&quot;.dm_DR&quot;,&quot;offset&quot;:[510,0],&quot;points&quot;:[&quot;cc&quot;,&quot;cc&quot;]}}" data-widget-type="Popup" style="display:none;"> <div class="next" style="font-size:100px;cursor:pointer;"> <img src="//gdp.alicdn.com/imgextra/i2/2330940642/TB25T6kcFXXXXawXXXXXXXXXXXX_!!2330940642.png" /> </div> </div> <div style="height:575px;width:1920px;overflow:hidden;padding:0px;margin:0px;" class="dm_DR"> <ul class="dmcontent" style="height:575px;width:1920px;padding:0px;margin:0px;"> <li class="item"> <a target="_blank" href="图片1链接"><img src="图片1地址" /></a> </li> <li class="item"> <a target="_blank" href="图片2链接"><img src="图片2地址" /></a> </li> </ul> </div> <div class="footer-more footer-more-trigger" style="padding:0px;border:none;left:50%;top:0;background-color:transparent;display:block;"> <div class="footer-more footer-more-trigger" style="z-index:99;width:1920px;height:45px;padding:0px;border:none;left:-960px;top:530px;background-color:transparent;"> <ul class="dms" style="width:950px;height:45px;margin:0 auto;text-align:center;border:none;color:#FFF;"> <li class="hidden" style="display:inline;background:none;margin:0 5px;cursor:pointer;padding-top:10px;line-height:1.4;font-size:27px;"> ● </li> <li style="display:inline;background:none;margin:0 5px;cursor:pointer;padding-top:10px;line-height:1.4;font-size:27px;"> ● </li> </ul> </div> <div class="footer-more footer-more-trigger" style="z-index:98;width:1920px;height:45px;padding:0px;border:none;left:-960px;top:530px;background:none;background-color:transparent;"> <ul class="dmb" style="width:950px;height:45px;margin:0 auto;text-align:center;border:none;color:#333333;"> <li style="display:inline;background:none;margin:0 5px;cursor:pointer;padding-top:10px;line-height:1.4;font-size:27px;"> ● </li> <li style="display:inline;background:none;margin:0 5px;cursor:pointer;padding-top:10px;line-height:1.4;font-size:27px;"> ● </li> </ul> </div> </div> </div> </div> </div> </div> <ul class="ks-switchable-nav" style="display:none;"> </ul></div>

如何制作淘宝全屏滚动海报

5、点确定,再点右上角的“发布”按钮,就可以看到装修效果了。

如何制作淘宝全屏滚动海报
© 手抄报圈