【原创】教你如何在有赞店铺实现折叠菜单的效果

"text/javascript" class="js-replyreload">replyreload += ',' + 346184;

回复获取更多自定义样式代码修改：

游客，如果您要查看本帖隐藏内容请回复

扫一扫二维码，来预览一下效果吧！

具体步骤如下：
1.打开一个店铺的有赞后台，在顶部导航找到【店铺】，进入【店铺】选项后，在左侧导航找到【自定义页面模块】，在【自定义页面模块】页面，点击【新建自定义页面模块】。
然后，添加【富文本】编辑框，在编辑框随意输入几个字符，例如“折叠”。

然后，右键点击箭头指向位置，选择【审查元素】。

然后，打开了开发工具，按CTRL+F，输入【contenteditable】，找到项目，打开折叠代码，然后右键点击折叠代码，选择【Edit as HTML】。
将以下代码，粘贴到输入框中。保存即可。然后你想在哪里调用，就可以直接用【自定义模块】来加载吧！



代码如下：

1. <fieldset style="border: 0px none; padding: 0px;">
   
2.     <details>
   
3.         <summary style="color:#fff; padding:10px; background-color:#000; cursor:pointer;">
   
4.             <span data-brushtype="text" style="font-size:15px; line-height:21px; margin-bottom:15px; text-align:justify; text-indent:28px; white-space:pre-wrap;">折叠样式，点击有惊喜</span>
   
5.         </summary>
   
6.         <section style="border: 4px solid #000; padding: 2px;">
   
7.             <blockquote style="white-space: normal; font-size: 14px; line-height: 25px; padding: 10px 10px; max-width: 100%; border: 0px;">
   
8.                 <p>
   
9.                     折叠菜单示例！
   
10.                 </p>
    
11.                 <p>
    
12.                     扫描关注微信号，获取相关教程！
    
13.                 </p>
    
14.                 <p>
    
15.                     <img src="http://imgqn.koudaitong.com/upload_files/2015/03/26/FtykxZbh_xT6oOA6S5CmbLuDc07-.jpg!730x0.jpg"/>
    
16.                 </p>
    
17.             </blockquote>
    
18.         </section>
    
19.     </details>
    
20. </fieldset>

复制代码

如果有疑问，可以随时来找我们咨询！扫一扫来咨询我们吧！

有赞店铺客服链接：

1. http://wap.koudaitong.com/v2/im?c=wsc&v=2&kdt_id=店铺ID#talk!id=店铺ID

复制代码

悬浮窗口代码：

1. <p><a href="http://wpa.qq.com/msgrd?v=3&uin=3122942294&site=qq&menu=yes" style=" z-index:9999; text-decoration:none; font-weight:bold; position: fixed; z-index: 999; right: -6px; bottom: 220px; display: inline-block; width: 20px; border-top-left-radius: 10px; border-top-right-radius: 5px; border-bottom-right-radius: 5px; border-bottom-left-radius: 10px; color: white; font-size: 17px; line-height: 17px; box-shadow: rgb(102, 102, 102) 0px 0px 5px; word-wrap: break-word; padding: 8px 6px; border: 2px solid white; background: rgb(242, 12, 12);">召唤掌柜</a></p>

复制代码

【剑走偏锋】教你如何在有赞店铺实现多客服的效果
【华山论剑】基于有赞店铺开发第三方游戏营销插件
【红包教程】让你的公众号免费拥有发放微信电影票红包的功能

本帖最后由 小草〈草根电商〉 于 2016-6-13 09:42 编辑

来学习啦！！！！！

隐藏了什么东西？？？

赞 赞 赞 赞 赞

厉害学习学习厉害学习学习厉害学习学习

找了好久

酷炫~还是希望能出折叠菜单~~~

谢谢分享啊~~

不知道能不能学会用，还有代码需要调整，先收藏吧！

请问为什么 background-color:#000  修改了颜色之后，保存后再次打开，还是原来的颜色呢？ 改变不了的~~~ ？？

学习。。。。。。