3.2.1.joomla如何添加banner大图轮播图片

banner大图就是下图红框部分，由一张banner图片、图片标题、图片描述以及图片按钮组成，具体介绍看下图：

一、管理入口

操作路径：网站后台--基础设置--Banner管理；

二、添加Banner

点击新建可以增加banner

点击新建后，会跳转到新建banner页面

2.1 名称

banner标题；

2.2 别名

自动生成，无需填写；

2.3 状态

选择发布，不发布前台不显示；

2.4 分类

一般默认分类就可以；

2.5 图片

banner显示大图，可通过图片上传组件，自定义上传Banner图片；

【注意】

Banner图片的尺寸需根据使用的网站模板而定，一般建议1920px*高度自定义；

同一栏目（页面）上传多张图片展示时，建议Banner图片尺寸保存一致；

Banner图片的文件大小应尽量控制在300kb以内，过大的图片文件会严重影响网站访问速度；

如无艺术字体展示效果需要，建议不要将文字直接设计在图片上，而是使用系统自带的文字展示功能添加文字，具体可参考图片标题及图片描述文字设置部分。

2.6 Banner高度与尺寸

网站模板采用响应式布局，可按浏览设备终端自适应显示，一般是根据浏览器屏幕宽度自适应缩放Banner宽度，因此建议Banner图片的宽度设计为1920px，手机端图片宽度设计为750px左右，而图片高度可以根据自己的需要设计，但需要保持所有相同展示端图片尺寸一致。

图片上传后，还可以在Banner管理页面和添加编辑页面设置电脑、平板、手机端的显示高度，如下图，但无特殊需要，此处设置建议为0，让系统自适应高端显示Banner。

如设置高度，则同一栏目（页面）所有的Banner图片同一设备端高度需保持一致。

2.7 图片标题

每张Banner图片都支持自定义图片标题，并可设置标题的颜色和文字大小。

添加或编辑Banner时，可自定义设置图片标题、标题颜色、字体大小等，如图，留空则不显示。

展示效果如下图：

【注意】

此功能需要网站模板支持，部分模板制作者可能并未兼容此功能；

字体大小和颜色留空时，网站前台将使用网站模板默认参数；

字体大小可以自定义输入数字，例如14，则表示字体大小是14px（14像素）；

字体颜色可在颜色选择器中选择，也可以直接输入十六进制颜色代码，如“#000000”；

图片标题显示位置可自定义设置，具体参考：2.12。

2.8 图片描述

图片标题的补充，功能与图片标题一致，可参考2.7章节，图片标题和图片描述可以独立存在，也可以全部填写。

添加或编辑Banner时，可自定义设置图片描述、文字颜色、字体大小等，如图，留空则不显示。

展示效果如图

【注意】

此功能需要网站模板支持，部分模板制作者可能并未兼容此功能；

字体大小和颜色留空时，网站前台将使用网站模板默认参数；

字体大小可以自定义输入数字，例如14，则表示字体大小是14px（14像素）；

字体颜色可在颜色选择器中选择，也可以直接输入十六进制颜色代码，如“#000000”；

图片描述的显示位置和标题保存一致，可自定义设置，具体可参考2.12。

2.9 链接地址

每张Banner图片都支持添加超链接地址，链接地址需要包含http或https，并可设置是否新窗口打开，建议不要给同一张图片同时使用链接地址和按钮链接。

2.10 是否新窗口打开

添加或编辑Banner时，可自定义设置Banner链接地址及链接打开方式，默认新窗口打开。

2.11 图片替代文字

图片替代文字，一般不需要填写。

2.12 图片文字位置

文字显示的位置，一般显示在左侧居中

显示具体位置如下图。

2.13 所属菜单

同一张Banner图片可显示在全站，也可以只显示在指定的栏目（页面），一个栏目（页面）下可添加多张Banner图片轮播显示，多张Banner需要保持图片尺寸一致。添加或编辑Banner时，设置Banner图片所属栏目，可选择所有栏目或自定义勾选

可以切换到手机版，对手机版进行单独banner设置：

2.14 手机端图片地址

添加或编辑Banner时，可通过图片上传组件，自定义上传手机端Banner图片

2.15 手机端图片标题

留空显示2.7章节设置的“图片标题”，设置此参数后，可让手机端显示不一样的标题。

2.16 手机端图片描述

留空显示2.8章节设置的“图片描述”，设置此参数后，可让手机端显示不一样的描述。

2.17 手机端图片文字位置

用于控制手机端图片标题、描述、按钮（按钮设置可参考2.9章节）在手机端Banner图片显示的位置，此功能需要网站模板支持。

三、编辑Banner

点击对应banner后面的编辑就可以进行编辑，具体操作同添加banner

四、删除Banner

点击对应banner后面的删除就可以进行删除单个banner，或者选中需要删除的banner，然后点击：操作-》放入回收站；

【注意】此操作是暂时将banner放入回收站，如果要彻底删除，可进入回收站彻底删除；

首先状态筛选框选择回收站，可以点击对应banner后面的【X】删掉单个banner，也可以勾选需要删除的banner，然后点击【彻底删除】按钮彻底删除对应的banner。

五、Banner排序

点击表格每行空白区域上下拖曳后即可改变排序