系统Banner设置
操作入口:后台 > 系统设置 > 系统Banner设置
什么是系统Banner? 系统Banner是子页面顶部的大图横幅,用于展示各系统模块的视觉形象。它与首页轮播图不同——首页轮播图仅在首页展示多张切换图片,而系统Banner是每个子页面(如产品列表页、新闻列表页等)顶部固定的单张大图。
三种Banner的区别
| 类型 | 位置 | 数量 | 用途 |
|---|---|---|---|
| 首页轮播图 | 仅首页顶部 | 多张,自动轮播 | 展示重要推广内容、活动信息 |
| 系统Banner | 各子页面顶部 | 每个系统一张 | 展示产品系统、新闻系统、招聘系统的视觉形象 |
| 分类Banner | 各分类列表页顶部 | 每个分类一张 | 展示各分类的专属视觉形象 |
操作步骤
1
进入Banner设置页面
登录后台管理系统,在左侧菜单中点击「系统设置」展开子菜单,然后点击「系统Banner设置」进入设置页面。也可以在网站设置页面中切换到「系统Banner设置」选项卡。
系统Banner设置
当前页面显示「系统Banner设置」选项卡
1
点击系统Banner设置
在左侧菜单「系统设置」下点击「系统Banner设置」进入设置页面
2
上传各系统Banner
在系统Banner设置页面中,分别为产品系统、新闻系统和在线招聘上传对应的Banner图片。点击「上传图片」按钮选择本地图片文件,上传成功后图片路径会自动填入输入框。
系统Banner设置
产品系统首页Banner
+ 上传产品Banner图片 (1920×500)
新闻系统首页Banner
+ 上传新闻Banner图片 (1920×500)
在线招聘首页Banner
+ 上传招聘Banner图片 (1920×500)
1
上传产品Banner
点击上传区域选择产品系统Banner图片
2
上传新闻Banner
点击上传区域选择新闻系统Banner图片
3
上传招聘Banner
点击上传区域选择在线招聘Banner图片
3
保存设置
上传完所有Banner图片后,点击页面底部的「保存Banner设置」按钮保存修改。
保存Banner设置
1
保存Banner设置
点击「保存Banner设置」按钮,前台对应页面将立即显示新的Banner图片
保存成功 — Banner设置保存后,前台对应页面将立即显示新的Banner图片。
注意事项
Banner图片建议尺寸:系统Banner图片建议尺寸为 1920 × 500px,格式支持JPG、PNG、GIF。图片过小会导致拉伸模糊,过大会影响页面加载速度。
上传方式:您可以点击「上传图片」按钮从本地选择文件上传,也可以直接在输入框中填写图片的URL路径。上传成功后系统会自动填入图片路径。
前台调用方式
在模板文件中,可以使用以下标签调用各系统Banner:
<!-- 产品系统Banner -->
<img src="{product_banner}" alt="产品中心">
<!-- 新闻系统Banner -->
<img src="{news_banner}" alt="新闻资讯">
<!-- 在线招聘Banner -->
<img src="{recruit_banner}" alt="人才招聘">