叶子网络bbs论坛

标题: 首页管理(下拉：banner列表-logo上传-导航条管理) [打印本页]

作者: admin 时间: 2020-12-17 12:34
标题: 首页管理(下拉：banner列表-logo上传-导航条管理)
模块列表：
网站首页模块，基本都在“模块修改”里面上传，不要删掉后台的上传入口，找到对应内容后，点击编辑更改即可。不要自己添加调用标签，没有用的。自己删掉上传入口，网站上对应的模块也不会消失的，删网站模块得发我们来操作。图片尺寸全靠QQ截图来量，图做的小了会空放大模糊，做的大了，会有两侧部分不显示。
类似首页公司简介旁的图片，这种不是背景图形式，只限宽度，不限高度。做的图宽度稍微大于或等于量的宽度就可以了。（宽度小了留白就多了，太宽了会强制缩小，但图片大加载慢。）

banner列表：
网站首页顶部banner，宽度1920像素，高度用qq截图量，或者做和之前一样尺寸的。这个宽度确保24寸显示器刚好全部显示，比这小的显示中间部分画面，比这大的两侧空白，高度一般都要和示范的一样高，少数模板是高度不定的，两张高度必须完全一样。主要画面尽量往中间靠，不要紧贴左右两边，容易显示被遮挡显示不完整。banner上的文字如果保留模板默认的在后台填写，则banner高度由所有文字的总高度决定，两张banner上的大小文字，必须全部行数一样，才能保证两张高度一样。为了保险起见，最好用qq截图量一下，原来多高就做多高的。少数模板banner高度随文字高度变化，多数模板高度是固定的。banner都不限上传张数，一般最多3张，多了会打开变慢,几张banner大小加起来不要超过1M。

图片要求：用jpg格式，一般不要超过300k，最大不要超过500k，画质一般选10，最低可以选8。除了通栏的图宽度都是1920像素，其它模块图片，都要实际截图量尺寸（ctrl+alt+A），做差不多大的图,过大也会打开慢。png格式通常都很大，除了水印和logo，一般都不用的。

网站首页及公司简介里面通栏广告图、多张切换图、循环重复模块，一般都是在“banner上传”里面更改的，点击编辑即可。即使误删了，上传图片的时候选择对应的分类，就可以了。
涉及的背景图可以在昵图网http://www.nipic.com上搜相关关键词，在“共享图”类目下找图，发我们链接，我们来下载原图，处理好尺寸就可以上传了。

小图标可以在图标库网站上http://www.fontawesome.com.cn/faicons/找图，找到了复制图标名称填上即可。

注意：1、不管是“首页管理”还是“banner列表”编辑器里面上传的内容不要带有冗码，比如从word直接拷贝进去，从别的网站直接拷贝，带有大量冗码，会导致排版错乱或颜色混乱，如图所示

点击编辑器左上角html字样“源代码”按钮，删除文字之外的代码，或者复制的内容直接粘贴在这里，然后再次点击html“源代码”回到正常界面，这时保存，就可以了。或者把word之类上面的文字内容拷贝到文本文档里，再从文本文档全选-复制，粘贴到编辑器里面，这样可以可以清除冗码。
已经错乱的效果，也可以在编辑器里面全选-剪切，点开左上角源代码，粘贴，再点击源代码回到正常状态，最后点保存，也可以恢复正常效果。
2、有的排成一行的模块，如果内容的行数不一，会导致高矮不齐。如果是排列成两行，行数不一样造成的高矮不齐，会导致模块排列错位，只有通过更改内容统一模块高度才能解决排列错位问题。
3、首页导航条下方的banner，一般是不限上传多少张的，如果要增加banner，点击右上角添加banner 选择该分类即可。我们只设计两张，如果增加的banner要我们来设计，是100元每张简单设计，通常来说不要超过三张，总大小不超过1M为好，过大了banner这里会打开缓慢。
4、自定义链接部分，点开网站上目标页面，复制域名后面部分，粘贴过来就可以了。

5、banner刚好完整显示，需要同时满足三个条件，24寸显示器并且分辨率设置是1920*1080+100%浏览器放大设置+100%电脑显示设置。显示器小了左右挡住部分，大了会放大banner。浏览器和电脑显示放大也会挡住左右两侧。
6、banner排序数字越大越靠前，默认按添加先后顺序的。

Banner显示效果说明：响应式网站在手机上没有banner能显示全部的。传统网站在手机上按比例缩小，什么都看不清楚，响应式架构虽然通过调整结构不需要按比例缩小了，但是banner是没法调架构的，相比于按比例缩小造成什么都看不清，不如选择不缩小，这样至少可以看清中间部分。响应式设计里面，不再有按比例缩小的操作，个别网站有按比例缩小的banner，但那只是个别，我们按主流标准开发，不以个别为标准。如果就要小屏幕及手机端banner全部显示，可以取消banner切换效果，只显示一张banner（可以选择是电脑和手机都只显示一张，还是只有手机端打开才只显示一张），收费30元。也可以尝试重新找按比例缩小的特效换上去，但是由于特效代码兼容问题，要安装很多很多特效才有可能找到一个这个网站兼容的特效，这种修改收费500元，如果最终找不到兼容的，退款400元，恢复原样。banner显示多少以及每个人QQ截图量的尺寸，都和3个要素同时有关：浏览器显示是否100%、屏幕尺寸、显示器分辨率设置，尤其分辨率设置这块，不同的设置显示的范围也是立即变化的。banner设计不要粗暴的罗列产品，这种画面有下面的产品推荐就够了，建议放背景图，这样不管全部显示，还是两侧部分遮挡，都不妨碍图片整体上的美感，banner的作用是吸引客户继续看下去，提升客户继续看网站的兴趣，不会有客户只看见了banner就准备付款下单的，罗列产品只会适得其反，到时两侧产品被遮挡一半，效果立即就差多了。
https://www.ez-leaf.com/soho-k.html 这是传统非响应式网站，都是手机端banner按比例缩小的，不管上面文字看不清。
https://www.templatemonster.com/html5-website-templates/ 这是美国模板开发领域排名第一的怪兽公司官网，为了banner上文字和画面看的清，全部取消了banner按比例缩小的传统开发规则。
不止是首页banner，内页banner以及首页模块背景图，都是以背景图的方式显示，都不会根据屏幕大小按比例缩放，只会屏幕越小两侧遮挡越多。手机端横屏竖屏，平板横屏竖屏，笔记本，小尺寸显示器，分辨率设置过小等等，都是一样的原理。
如果想要手机端100%绝对完美，唯一办法就是单独做个手机站，同理，如果需要平板端绝对完美，也得专门做个pad端网站。像淘宝网、京东商城等上市公司都是单独做一个手机网站的。
PS：外贸业务客户群都是办公群体，几十上百万的订单主要还是电脑端完成的，少有手机上点点就下单的，所以显示效果以电脑端为主。办公电脑中以台式电脑居多，笔记本办公占少数，而台式电脑的各种尺寸显示器中，以24寸为主流，更大或更小的是少数，所以最终banner完整显示效果以台式电脑24寸显示器为准。

作者: admin 时间: 2020-12-17 14:10
logo
不要尺寸过大，一般上传多大的显示多大，用QQ截图量logo位置的尺寸，差不多大小就可以了。选中要上传的logo后，要点击“上传”按钮，再点击下方“保存”按钮。少数模板上传的再大也不会显示原大小，但超大图会拖慢网站打开速度。
icon
位于网站顶部状态栏，谷歌会对有icon图标的网站优先照顾排名，并且显示在搜索结果的左侧，形象也美观些。ico图标支持jpg \png\gif等常规图片格式，尺寸最小32像素边长就可以了，大一点也行，不要特别大，形状得正方形，不要用很长的logo。

百度搜索结果也有显示

作者: admin 时间: 2020-12-17 14:14
导航条管理
在这里可以自己更改导航栏目的名称，可以控制栏目的排序。可以自己增加或者减少导航栏目。导航栏目名称可以随便写什么，它只是用来看的，点击跳转只根据链接。导航链接不要自己随便乱写名字，它只会跳转到真实存在的页面上，不会智能揣测你心里面想要的页面，它也识别不了你自己创的链接地址是什么意思。products栏目是自动调取产品分类的，分类改了，这个栏目下的下拉菜单就变过来了，不在导航条管理里面改。
增加导航栏目，只支持三种页面类型：单页，产品列表页，新闻列表页。

一、增加一个单页栏目。
1、先增加一个单页面，拷贝页面链接。

2、增加一个导航栏目或者增加一个已有导航栏目的下拉菜单，粘贴之前复制的网址，点保存。

二、添加一个新闻列表页。
1、新闻里面新建一个新闻分类，拷贝分类链接。

2、增加一个导航栏目或者已有导航的下拉菜单里面，粘贴链接地址。

三、每个产品分类单独做一个导航栏目，或者自定义产品栏下拉菜单。(产品栏下拉菜单默认是调用产品分类的，不支持自定义)
1、在产品分类列表中拷贝一级分类链接。

2、新建好导航栏目，或者在下拉菜单中，粘贴这个链接地址。

四、如果过去某个栏目删了，现在想启用，只要增加这个栏目，并且写上对应的链接地址就可以了，页面本身还在，不需要再次制作，地址都是下面这样的，照抄上去就行。

注意：网站内部链接填相对链接就可以了，外部链接才需要填绝对链接。带上域名的是绝对链接，比如https://abcd.com/about.html 。不带域名的是相对链接，比如 about.html。一个完整的网址，只截取域名右侧/符号后面部分即右侧部分，就是相对链接。而链接到新浪网、淘宝网等不是你自己的网站上，就是外部链接。像产品详情页、新闻详情页等其它页面，都可以在前台打开该页面，复制网址的相对链接到后台粘贴就可以了。

五、当需要的下拉项超过5个时，更多的填下面，不限数量，格式如图所示：

作者: admin 时间: 2022-7-12 09:15
网站底部二维码
二维码在首页管理里面上传，把原演示二维码改掉就可以了，不要删掉再添加。具体怎么制作二维码，看需求。
1、如果要放微信加好友二维码、微信收款二维码、支付宝收款二维码等这些自己有的，只要把尺寸处理成合适的大小就可以直接上传了。
2、如果要放的是我们示范的那种手机扫码在手机上打开网站，可以在“草料二维码”网站https://cli.im/url 上生成就可以了。选择网址静态码，点击生成二维码，选择二维码下面的“样式美化”，再点击上方的“模板”，选择看好的样式，在右侧二维码上右击另存为到本地使用。这个尺寸较大，要处理小一点。
3、已有二维码，不会ps图片，需要裁图、处理大小这些操作，可以把图片发给我们来处理。

作者: admin 时间: 2023-6-21 16:24
附加说明：
现在终端显示器的尺寸纷繁复杂，笔记本就分为12寸、14寸还有16寸的。台式电脑有20寸、24寸、36寸的。还有手机端不光大小不同，还分横屏和竖屏。平板电脑尺寸也各不同，也分横屏和竖屏。就算同样的尺寸，还有不同的分辨率设置，就算前两个一样，有的用户还喜欢改掉100%的缩放设置，放大了看，可以浏览器放大，可以电脑系统设置放大，这些都影响显示效果。
响应式网站虽然可以兼容各种尺寸，只是基本兼容，不是完美兼容，完美可能永远都不会存在，因为人的审美是不完美的，不统一的。因此，网站开发界就确定了两个不约而同的标准:

1、网站最完美的呈现效果，按使用最多的显示器尺寸进行开发，使用最多的是24寸台式电脑显示器，分辨率设置最多的是按推荐的1920*1080，浏览效果按照大多数人的标准，浏览器按100%的缩放值，电脑系统按照100%的缩放值。
2、现在开发的响应式网站banner，基本都采用上层写文字，下层放图片，在屏幕变小的情况下，看清楚大于看全面，因此，文字按比例缩小，并全部显示，但下层图片不按比例缩小，只显示中间部分，两侧挡住多少就看屏幕有多小。

因此，在非标准情况下，显示效果就五花八门了，但是网站只能以大多数为标准去改，不以客户自己使用的显示器为标准去改。尤其是在放大的情况下，显示的内容就会少，挡住的就多，可以把自己电脑尽量调整到接近标准设置。

有少部分用户喜欢放大了看，有的是给浏览器放大了，按住ctrl键，滚动鼠标滚轮，就可以调浏览器的放大缩小，但是往往不知道什么程度是100%显示。以360安全浏览器为例，可以点击右上方菜单栏，光标移到“网页缩放”，就可以看到当前的缩放比例，如图所示：

有的用户不光浏览器看东西要放大，电脑上所有东西都要放大，因此在电脑系统设置里面就调大了缩放比例，如果想恢复，以Windows10系统为例，回到电脑桌面，空白处右击，点“显示设置”，如图，就可以看到当前设置的值了。

欢迎光临叶子网络bbs论坛 (https://fob0.com/)