如何上传弹窗图片以及二维码
1.首先登入后台地址,前台网站配置-图片文件上传库
2.点击《选择文件》,上传所需弹窗图片或二维码
二维码一般为正方形尺寸, 首页弹窗尺寸是600*400
2.1目前对文件的要求是:
文件不要大于500k
文件扩展名要小写 尽量用英文加数字,比如xxxx.png or xxxx.bmp xxxx.jpg ( png bmp jpg) 都要求小写
图片说明没限制
重要:关于图片保存格式要求
ps 为了您的站点有更好的图片加载速率和效果,建议您制作图片的时候,保存格式如下:
彈窗請看 3.1
⑴上传完弹窗图片后,点击复制《访问路径》
⑵进入《前台网站配置》,选择右上角的《首页JS》,将代码复制上去(代码详情请看最后)
⑶将弹窗访问路径在红色标注处
⑷标题自行修改,保存即可
二維碼請看 3.2
⑴上传完二维码代码后,点击复制《访问路径》
⑵进入《银行资金管理》里的《银行支付管理》,在添加银行卡页面将二维码的访问路径粘贴上去
⑶保存即可
首页JS代码:
每次点击首页都会弹出
<div id="sdShowModal" class="modal" style="width:640px; margin-left:-300px; visibility:visible;"> <div class="modal-hd"> <h2>请在这里输入标题</h2> </div> <div class="modal-content modal-message"> <p class=""><img src='请在这里输入后台上传的图片地址'></p> <div class="forms-btn-g"><a href="javascript:void(0);" id="sdShowModalbtn" class="btn-sub">关闭</a></div> </div> </div> <div class="reveal-modal-bg" id="sdShowModalmask"></div> <script type="text/javascript"> $("#sdShowModalbtn").click(function(){ $("#sdShowModal").hide(); $("#sdShowModalmask").hide(); }); </script>
弹窗框右上角出现 小叉叉的关闭按键
<div id="sdShowModal" class="modal" style="width:640px; margin-left:-300px; visibility:visible;"> <div class="modal-hd"> <a href="javascript:void(0);" class="modal-close sd-close-btn"></a> <h2>请在这里输入标题</h2> </div> <div class="modal-content modal-message"> <p><img src='请在这里输入后台上传的图片地址'></p> <div class="forms-btn-g"><a href="javascript:void(0);" class="btn-sub sd-close-btn">关闭</a></div> </div> </div> <div class="reveal-modal-bg" id="sdShowModalmask"></div> <script type="text/javascript"> $(".sd-close-btn").click(function(){ $("#sdShowModal").hide(); $("#sdShowModalmask").hide(); }); </script>
每次浏览器打开首页 显示一次。点击其他页面跳回首页不显示。关闭浏览器重新打开又显示。
<div id="sdShowModal" class="modal" style="width:640px; margin-left:-300px; visibility:hidden;"> <div class="modal-hd"> <h2>请在这里输入标题</h2> </div> <div class="modal-content modal-message"> <p class=""><img src='请在这里输入后台上传的图片地址'></p> <div class="forms-btn-g"><a href="javascript:void(0);" id="sdShowModalbtn" class="btn-sub">关闭</a></div> </div> </div> <div class="reveal-modal-bg" id="sdShowModalmask" style="display:none;"></div> <script type="text/javascript"> $("#sdShowModalbtn").click(function(){ $("#sdShowModal").hide(); $("#sdShowModalmask").hide(); }); $(document).ready(function(){ if(getCookie("divpoponce")!="true"){ document.cookie = 'divpoponce=true'; $("#sdShowModal").css("visibility","visible"); $("#sdShowModalmask").show(); } }); </script>
, multiple selections available,